1、 查看 HTML 源代码的方法点击鼠标右键,点击 View Source(查看源文件)命令选择浏览器菜单 View(查看)中的 Source(源文件)命令。 网页其实就是 HTML 文件 HTML 标记最基本的格式是: 内容 HTML 标记 html 文件头 head 题目 title 主体 body 正文标题标记格式:、 、 、 、 、 作用:设置正文标题字体的大小 分段标记和换行标记格式:分段,换行作用:分段和换行(另起一行) 注释语句标记格式:作用:可以把代码的功能、作者、注意事项等信息放入其中特点:注释语句的内容都会被浏览器忽略,不显示在网页上 有序列表每个列表项前标有数字,表示顺序
2、由开始,结束其中的每个列表项由开始,结束 无序列表不用数字标记每个列表项,而采用一个符号标志每个列表项,比如圆黑点、方块等。由开始,结束其中的每个列表项同样由开始,结束。 定义列表常用于术语的定义和解释由开始,结束术语由开始,结束术语的解释说明由开始,结束,里的文字缩进显示。 属性通常由属性名和属性值成对出现,语法格式如下: 属性通常是写在开始标记里面,属性值一般用双引号标记起来(注意:是英文半角状态下的双引号),多个属性并列的时候,用空格间隔 align 属性作用:定义对齐方式常见属性值有 left、center、right,能够控制大多数元素的左对齐、居中、和右对齐。 style 属性作用
3、:定义样式,如文字的大小、色彩、背景颜色等。书写格式: 一个 style 属性中可以放置任意多个样式属性名称,每个属性名称对应相应的属性值,属性名称之间用分号隔开。 RGB分别代表 Red、Green、Blue 的首字母,即红、绿、蓝三原色每种原色的最小值为 0(0) ,最大值为 256(FF)表示方式:#RRGGBB,其中 RR、GG、BB 的取值范围都是 00 到 FFaqua(浅绿) black(黑) blue(蓝) fuchsia(紫红) gray(灰) green(绿) lime(酸橙 ) maroon(栗色) navy(藏青) olive(橄榄) purple(紫) red(红)
4、silver(银灰) teal(水鸭 ) white(白) yellow(黄) 标记是一个块状的容器,其默认的状态就是占据整个一行。 标记是一个行间的容器,其默认状态是行间的一部分,占据行的长短由内容的多少来决定。 基本语法结构: 基本属性属性 描述 可取值direction 移动方向 left,right,down,upbehavior 移动方式 scroll,slide,alternateloop 循环次数 -1,2,scrollamount 移动速度 2,10,align 对齐方式 top,middle,bottombgcolor 背景颜色 #rrggbbheight 底色所占高度 40
5、pxwidth 底色所占宽度 50px利用简单的 JavaScript 语句控制文字的运动状态onmouseover 表示鼠标经过滚动字幕时stop()意为停止滚动。 最常用的字符实体 显示结果 说明 实体名称 实体代码 显示一个空格 大于 “ 双引号 版权 注册商标 乘号 除号 标记 标记说明 粗体 bold 斜体 italic文字当中划线表示删除文字下划线表示插入 下标 上标 缩进表示引用保留空格和换行 表示计算机代码,等宽字体 绝对路径指带域名的文件的完整路径构成一个传输协议(如 HTTP 协议)网络域名或者服务器 IP 地址网站结构的目录树文件名(文本、图片、音频和视频等)例:http
6、:/ 各种相对路径:总结归纳起来,对于各种相对路径主要有三种情况。当前目录形式: src=”*.jpg”含义:源文件和引用文件在同一个目录里,直接写引用文件名当前目录上一层形式:src=”/*.jpg”含义:/表示源文件所在目录的上一级目录,/表示源文件当前目录的上一级目录的上一级目录。 下级目录形式:src=”*/*.jpg”含义:引用下级目录的文件,直接写下级目录文件的路径,其中*代表具体的文件名或者目录名。 HTML 中插入图片用的是标记,它的属性包括图片的路径、宽、高和替代文字等。基本语法格式# : 代表图片的 URL *: 代表在浏览器尚未完全读入图片时,在图片位置显示的替代文字。
7、基本语法. 例如:yahoo sport 超链接文本默认带下划线并且文字颜色为蓝色,当鼠标在“超链接名”上方时指针会变成手状。 target 属性_blank浏览器总在一个新打开、未命名的窗口中载入目标文档。_self这个目标的值对所有没有指定目标的 标签是默认目标,它使得目标文档载入并显示在相同的框架或者窗口中作为源文档。_parent这个目标使得文档载入父窗口或者包含来超链接引用的框架的框架集。如果这个引用是在窗口或者在顶级框架中,那么它与目标 _self 等效。_top这个目标使得文档载入包含这个超链接的窗口,用 _top 目标将会清除所有被包含的框架并将文档载入整个浏览器窗口。 tit
8、le 属性超链接的标题当鼠标在超链接上方时会出现的对超链接进行说明的方框图片超链接 在和之间包含,鼠标点击图片即可链接到 href 所对应的文件。1表格标记 定义一个表格,每一个表格只有一对和,一张页面中可以有多个表格。2表格行标记 定义表格的行,一个表格可以有多行,所以和对于一个表格来说不是唯一的。3.表格单元格标记 定义表格的一个单元格,每行可以有不同数量的单元格,在和之间是单元格的具体内容。 定义表头单元格,位于与之间的文本默认以粗体居中显示。表格的基本结构 定义表格定义表行定义表头定义单元格1表格的宽度Width 属性 指定整个表格或表格的某一行和某个单元格的宽度。单位可以是百分比(%
9、)或者像素(px),百分比设置宽度的相对值,像素设置宽度的绝对值。2表格的高度height 属性:指定整个表格或表格中的某一行和某个单元格的高度。单位可以是百分比(%)或者像素(px),百分比设置高度的相对值,像素设置高度的绝对值。3.bordercolor 属性可以指定表格或某一个单元格的边框颜色,它也可以指定某一行的边框颜色,格式分别为、和。4.bgcolor 属性用于指定表格或某一个单元格的背景颜色,background 属性用于指定表格或某一个单元格的背景图片。格式分别为和, 和。 表格的对齐方式1.表格的水平对齐align 属性:指定表格在窗口中的水平对齐方式,也可以指定某一行或某一
10、个单元格里的内容(文本、图片等)相对于所在单元格的水平对齐方式。有三个值,left、center 和right,分别代表左对齐、居中对齐和右对齐。格式分别为、和。2.单元格的垂直对齐valign 属性:指定某一行或某一个单元格里的内容(文本、图片等)相对于所在单元格的垂直对齐方式。有 top、middle、bottom 和 baseline 四个值,分别代表顶端对齐、居中对齐、底部对齐和基线对齐,格式为和。表格间距和边距 单元格的间距(cellspacing 属性):指定表格中单元格之间的距离,格式为。单元格的边距(cellpadding 属性):指定单元格里的内容(文本、图片等)距离单元格边
11、框的距离,格式为。 Colspan 属性值表示当前单元格跨越的列数,格式为, “#”处输入列数值。rowspan 属性值表示当前单元格跨越的行数,格式为,“#”处输入行数值。,表的题头(Header),指定表格题头部分的内容。,表的正文(Body),指定位于表格主体部分的内容。. - 表的脚注(Footer),指定位于表格脚注部分的内容。 简单的表单输入 是表单的标记,可以看做一个包含很多表单控件的容器,它的主要功能就是布局各种表单控件,让表单以友好的界面呈献给用户。基本语法结构是:表单的内容表单中常用的控件和属性控件标记 作用input type=“text“ 单行文本输入框input ty
12、pe=“password “ 密码输入框(输入的文字用*表示,以防别人偷窥)input type=“radio“ 单选框input type=“checkbox“ 复选框input type=“submit“ 将表单里的信息提交给表单里 action 所指向的文件input type=“reset“ 清除用户填的所有信息,回到初始状态select 下拉框textArea 多行文本输入框name=“ your_name “,是设定文本预的名称,后台程序中经常会用到 name 属性。 size=“数值“,设定此控件显示的宽度或者长度。 value=“预设内容“,设定此控件的预填内容。maxleng
13、th=“数值“,设定此控件可输入的最大长度。利用 type=“radio”就会产生单选控件,单选控件通常是罗列好几个选项供使用者选择,一次只能从中选一个。利用 type=“checkbox “就会产生复选控件,复选控件通常是罗列好几个选项供使用者选择,一次可以同时选多个。 利用来产生一个可输入多行文字的控件,两个标记之间的文字会出现在文本框中,可作为预设的文字。 应用就可以产生一个下拉菜单,另外还需要配合标签来产生选项。1表单提交属性用户填入表单的信息总是需要程序来进行处理,表单里的 action 就指明了处理表单信息的文件。method 属性表示了发送表单信息的方式。method 有两个值:
14、get 和 post。get 的方式是将表单控件的 name/value 信息经过编码之后,通过 URL 发送,信息量较小。而 post 则将表单的内容通过 http 发送,在地址栏看不到表单的提交信息,信息量较大。2表格布局表单表单的布局设计中,经常需要使用表格来帮助排版。表单和表格的正确嵌套顺序是:。3使用 lable 标签提升表单的可用性应用到了 lable 标签,如:, 其中的 for 属性用于指定与该标签相关联的表单控件。当 for 所指的名称和表单某控件的 id 值相同的时候,如:这本书对您是否有帮助?,则点击“这本书对您是否有帮助?”这段文字的同时,对应的单选控件会响应。1.sr
15、c 属性里有 src 属性,src 值就是网页的路径和文件名。如:src=“a.html“。设定此框架中要显示的网页名称,每个框架一定要对应一个网页,否则就会产生错误,这里就是要填入对应网页的名称。2.name 属性name=“a 设定这个框架的名称为 a,设置了 name 属性后才能指定这个框架来作链接目标。3.frameborder 属性frameborder=0,设定框架的边框,其值只有 0 和 1 两种 , 0 就是不要边框,1 就是要显示边框。边框是无法调整粗细的。 4.scrolling 属性scrolling=“no“,设定是否要显示滚动条效果,yes 是要显示卷轴,no 是无论
16、如何都不要显示,auto 是视情况显示。 5.noresize 属性设定使用者不可以改变这个框架窗口的大小,如果没有设定这个参数,使用者可以很容易的拖拽框架窗口,改变其大小。 6.marginhight 属性marginhight=4,表示框架高度部分边缘所保留的空间。 7.marginwidth 属性marginwidth=4,表示框架宽度部分边缘所保留的空间。利用超链接中的 target 属性实现,具体方法是 target=”框架名称” ,通过赋值不同框架窗口的名称,可以让超链接页面随心所欲的在不同的页面打开。在框架结构的应用过程中,有时会用到下面两种 target 的打开方式。target=”_top” 在顶层框架中打开超链接。target=”_parent” 在当前框架的上一层里打开超链接。标记能帮助设计者在浏览器页面上打开一个“小窗口” ,嵌入一张来源于其他位置的网页,而且这个内嵌框架可以同时设置宽度和高度,可以放在页面的任何位置,和标记建立的框架相比,拥有更多的灵活性,也简单很多。