经典学习html

【第1天】HTML概述和基本结构学习目的：了解什么是html，html能够做什么。掌握html基本结构，能够按照html的规范独立编写一个简单的html文档。HTML的重要性随着Intenet的飞速发展，看到了成千上万的网站，人们在浏览这些网站的时候，看到的是丰富的影像，文字，图片，这些内容都是通过一种名为html的语言表现出来的。对于网页设计和制作人员，尤其是开发动态网站的编程人员来讲，在制作网页的时候，html将是他们的基础。HTML语言的意义：HTML即HyperTextMarkupLanguage(超文本标记语言)的缩写，是一种用来制作超文本文档的简单标记语言。超文本定义：超文本（Hypertext）基本上是一般的文本文件，只是在文本文件中另含有链接（Link）及其他文件的引用（Pointer），我们只要单击这些引用，即可链接其他相关文件。HTML标签和属性HTML是由标签和属性构成的标签名属性=值/方法，它们一起用于标识各个文档部件，告诉浏览器如何显示文档。标签通过指定某块信息为段落、标题、图片或链接等来标识文档部件。属性是标签的选项，用来在标签中修饰或进一步指定信息，比如颜色，高度，宽度等，属性要写在标签内，各属性之间无先后次序，属性是可选的，属性也可以省略而采用默认值。HTML文档的基本结构HTML超文本文档分文档头和文档体两部分，在文档头里，对这个文档进行了一些必要的定义，文档体中才是要显示的各种文档信息。HTML文档基本结构示例：html!------//超文本开始标签//------head!------//头开始标签//------title一个简单的HTML示例/title!------//浏览器窗口标题标签//------/head!------//头结束标签//------body!------//主体开始标签//------h1欢迎光临我的主页/h1hr/fontsize=7color=red这是我第一次做主页/font/body!------//主体结束标签//------/html!------//超文本结束标签//------组成HTML文档的几个基本标签：html/html标签详解：它在文档的最外层，文档中的所有文本和html内部标签都包含在其中，它表示该文档是以超文本标识语言（HTML）编写的。现在常用的Web浏览器（如IE、360、搜狗等）都可以自动识别HTML文档，并不要求有html标签，也不对该标签进行任何操作，但是为了使HTML文档能够适应不断变化的Web浏览器，还是应该养成不省略这对标签的良好习惯。head/head标签详解：它是HTML文档的头部标签，在浏览器窗口中，头部信息是不被显示在正文中的，在此标签中可以插入其它标记，用以说明文件的标题和整个文件的一些公共属性。若不需头部信息则可省略此标记，良好的习惯是不省略。title/title标签详解：它是嵌套在HEAD头部标签中的，标签之间的文本是文档标题，它被显示在浏览器窗口的标题栏中。body/body标签详解：此标签之间的文本是正文，是在浏览器中要显示的页面内容，它一般不能被省略。HTML标签的分类：HTML的标签分单标签和成对标签两种。1)成对标签是由首标签标签名和尾标签/标签名组成的，成对标签的作用域只作用于这对标签中的文档。例：strong加粗/strong2)单标签的格式标签名/，单独标签在相应的位置插入元素就可以了。例：br/编写HTML文档的注意事项：注意一：作为一般的原则，大多数属性值不用加双引号。但是包括空格、％号，＃号等特殊字符的属性值必须加入双引号。为了好的习惯，提倡全部对属性值加双引号（参数值为数字除外）。例：fontcolor=redface=宋体size=7被设置的内容/font注意二：输入始标签时，一定不要在“”与标签名之间输入多余的空格，也不能在中文输入法或全角输入状态下输入这些标签及属性，否则浏览器将不能正确的识别括号中的标志命令，从而无法正确的显示你的信息。注意三：br标签是单标签（意味着它没有结束标签，因此这是错误的写法：br/br）。在XHTML中，把结束标签放在开始标签中，也就是br/。body标签的属性：在body和/body中放置的是页面中所有的内容，如图片、文字、表格、表单、超链接等内容。body标签有自己的属性，设置body标签内的属性，可控制整个页面的显示方式。body标签的属性列表：link：设定页面默认的链接颜色。alink：设定鼠标正在单击时的链接颜色。blink：设定访问后链接文字的颜色。background：设定页面背景图像。bgcolor：设定页面背景颜色。leftmargin：设定页面的左边距。topmargin：设定页面的上边距。bgproperties：设定页面背景图像是否固定，即是否随页面的滚动而滚动（fixedscroll）。text:设置文本的颜色。这个是html最基础的知识，希望通过这篇文章可以让读者对html有感性上的认识!（本章完）【第2天】文字排版和颜色表示学习目的：能够利用一些基本的和文字、段落相关的标签制作各种格式的由文字组成的网页，例如个人简历、日记、诗词等。HTML中颜色表示方法：1、直接用英文单词来表示颜色(例如:red，blue，white，black等等)2、以六位十六进制来表示颜色。(例如:#ff00ff)3、以RGB模式表示，也就是用3个0至255之间的数字来分别表示红绿蓝三色的比重(例如rgb(100，100，100))换行标签br/：换行标签是个单标签，也是空标签（不包含任何属性的标签），在html文件中的任何位置只要使用了该标签，当文件显示在浏览器中时，该标签之后的内容将显示至下一行。段落标签p及属性：由p标签所标识的文字，代表同一个段落的文字。不同段落间的间距等于连续加了两个换行符，也就是要隔一行空白行，用以区别文字的不同段落。它可以单独使用，也可以成对使用。单独使用时，下一个p的开始就意味着上一个p的结束。良好的习惯是成对使用。格式：ppalign=参数其中，align是p标签的属性，属性有三个参数left，center，right这三个参数设置了段落文字的左，中，右位置的对齐方式。原样显示文字标签pre：要保留原始文字排版的格式（即空格、换行等），就可以通过pre标签来实现，方法是把制作好的文字排版内容前后分别加上始标签pre和尾标签/pre。居中对齐标签center：文本在页面中使用center标签进行居中显示，center是成对标签，在需要居中的内容部分开头处加center，结尾处加/center水平分隔线标签hr/：hr/标签是单独使用的标签，效果是显示水平线，用于段落与段落之间的分隔，使文档结构清晰明了，使文字的编排更整齐。通过设置hr/标签的属性值，可以控制水平分隔线的样式。水平分割线标签hr/的属性：size：设置水平分隔线的粗细。width：设置水平分隔线的宽度。align：设置水平分隔线的对齐方式(left，center，right)，默认值为center。color：设置水平分隔线的颜色，默认为black。noshade：取消水平分隔线的3D阴影。标题文字标签hn：hn标签用于设置网页中的标题文字，被设置的文字将以黑体或粗体的方式显示在网页中，其中n的取值为1-6，字体依次变小。标题标签的格式：hnalign=参数标题内容/hn标题文字标签hn说明：hn标签是成对出现的，hn标签共分为六级，在h1.../h1之间的文字就是第一级标题，是最大最粗的标题；h6.../h6之间的文字是最后一级，是最小最细的标题文字。align属性用于设置标题的对齐方式，其参数为left（左），center（中)，right(右）。hn标签本身具有换行的作用，标题总是从新的一行开始。font标签：font标签用于控制文字的字体，大小和颜色。控制方式是利用属性设置得以实现的。字体标签font的属性：face：设置文字使用的字体(默认为宋体)size：设置文字的大小(默认为3)color：设置文字的颜色(默认为黑色)font标签属性说明：face：用来设置使用的字体，默认为宋体，也可以设置字体族科，设置字体族科时优先显示前面的字体，当前面字体没有安装的时候依次显示后面的。设置字体的语法为:fontface=宋体hello/font设置字体族科的语法为：fontface=字体1,字体2…hello/fontsize：的取值为1-7，依次增大，也可以用”+”或“-”来表示相对值。color：为字体的颜色。fontsize字体“+”，“-”表示方法：size=+4等于size=7size=+3等于size=6size=+2等于size=5size=+1等于size=4size=+0等于size=3size=-1等于size=2size=-2等于size=1特定文字样式标签（物理类型）：(1)粗体标签strong放在strong与/strong标签之间的文字将以粗体方式显示。(2)斜体标签i放在i与/i标签之间的文字将以斜体方式显示。(3)下划线标签u放在u与/u标签之间的文字将以下划线方式显示。(4)sup上标标签：12sup2/sup=144(5)sub下标标签：硫酸亚铁的分子式是Fesub2/subSOsub4/sub注释标签：在HTML文档中可以加入相关的注释标记，便于查找和记忆有关的文件内容和标识，这些注释内容并不会在浏览器中显示出来。注释标签的格式有如下：!--注释的内容--（本章完）【第3天】表格标记及其属性学习目的：能够独立利用表格技术制作网站的头部和底部，能够按照要求修饰和表格相关的外观。表格的基本结构：标签描述table…/table用于定义一个表格开始和结束caption…/caption定义表格标题，只能对每个表格定义一个标题。通常这个标题会被居中于表格之上。thead/thead定义表格的表头，它应该与tbody和tfoot元素结合起来使用。tbody…/tbody定义表格主体（正文）tfoot…/tfoot定义表格的页脚（脚注或表注）tr…/tr定义一行标签，一组行标签中可以有多个th或td组成的单元格th…/th定义表头单元格.表格中的文字将以粗体显示，在表格中也可以不用此标签，th标签必须放在tr标签内td…/td定义单元格标签，一组td标签将建立一个单元格，td标签必须放表格的定义规则:在一个最基本的表格中，必须包含一组table标签，一组标签tr和一组td标签或th标签。表格table标签的重要属性：width：表格的宽度height：表格的高度align：表格在页面的水平摆放位置background：表格的背景图片bgcolor：表格的背景颜色border：表格边框的宽度(以象素为单位)bordercolor：表格的边框颜色bordercolorlight：表格边框明亮部分的颜色bordercolordark：表格边框昏暗部分的颜色cellspacing：单元格之间的间距cellpadding：单元格内容和单元格边界之间的空白距离的大小表格的边框显示状态frame：表格的边框分别有上边框、下边框、左边框、右边框。这四个边框都可以设置为显示或隐藏状态语法格式：tableframe=边框显示值表格的边框显示状态frame的取值：void：不显示表格边框