动态网页制作与编程HTML代码.pptVIP

计算机科学与技术学院608教研室 动态网页制作与编程 孟宇龙 mengyulong@ 本次课程主要内容 一、认识HTML语言 二、HTML语言语法规则 三、HTML语言标签分类 一、认识THML语言 HTML只不过是组合成一个文本文件的一系列标签。 一般有两类标签 围堵标记 空标记 一、认识THML语言（续上） 围堵标记:顾名思义，它以起始标记及终结标记将文字围住，令其达到预期显示效果。 例如td/td 空标记:是指标记单独出现，只有起始标记没有终结标记。 例如img 二、HTML语法规则 HTML文件总是以htm或html作为文件的扩展名。 HTML标签不区分大小写，如p与P是一样的。 多个HTML标签间可以循环嵌套，但不可以交叉嵌套。 HTML文件一行可以写多个标签，一个标签也可分多行书写，不用加任何续行符。 HTML文件由浏览器解释时只认标签，并不解释源文件中的换行、回车和多个连续空格。若要显示换行则用br标签，换段则用p标签。 三、HTML语言标签分类 网页结构类标签 段落类标签 列表类标签 格式化类标签 超链接类标签 图像类标签 表格类标签 框架类标签 1 网页结构类标签 1.1 HTML文档标签 格式：html……/html 说明：html处于文档的最前面，表示HTML文档的开始，即浏览器从html开始解释，直到/html为止。 1.2 HTML文件头标签 格式：head……/head 说明：head紧跟html标签的后面，表示文件头部开始，到/head结束。其内容包含了该HTML页面的标题和说明信息，如编码方式、关键字、编辑软件、作者信息等。 1 网页结构类标签（续上） 1.3 HTML文件标题标签 格式：title……/title 说明：该标签定义的标题内容不在浏览器窗口中显示，而是在浏览器的标题栏中显示。通过该标题内容的设定，可以使读者迅速了解该网页的主要内容以及在使用有哪些信誉好的足球投注网站引擎时可以找到该页。 1 网页结构类标签（续上） 1.4 HTML文件说明信息标签 格式：meta…… 说明：该标签可以用来设定说明信息，一般放在文件头部内。 属性： （1）描述语言字符集的信息，例如：meta http-equiv=Content-Type content=text/html;charset=#，常用的#可以为gb2312、x-mac-roman、big5等。 （2）描述文档的自身信息，如作者信息、过期时间、关键词列表等。例如： meta http-equiv=作者 content=李冰 meta http-equiv=文档期限 content=2004/4/20 1 网页结构类标签（续上） 1.5 HTML文件主体标签 格式：body……/body 说明：位于头部之后，以body开始，直到/body结束。定义了网页上显示的主要内容与显示格式，是整个网页的核心，浏览器窗口中所能显示的内容全部被包含在该标签中。 属性：用于设定网页的总体风格。其中： bgcolor 设置网页的背景色。 background 设置网页的背景图像。 text 设置网页文本的颜色。 link 设置尚未被访问过的超链接颜色，默认为蓝色。 vlink 设置已被访问过的超链接颜色，默认为蓝色。 alink 设置一个正被激活的超链接颜色，默认为红色。 1 网页结构类标签（续上） 1.6 注释标签 格式：!--……-- 说明：在HTML文件中加入注释可以使程序清晰，容易理解。该标签中的内容在被浏览器解释时会被忽略，也不会被显示。这样做有助于您在以后的时间对代码的编辑。 2 段落类标签（续上） 2.1 标题标签 格式：hn……/hn 说明：该标签可以用来指明页面上的n级标题，其中n=1～6，主要用于对文本中的章节进行划分。 2.2 段落标签 格式：p……/p 说明：定义段落，自动在其前后创建一些空白。浏览器会自动添加这些空间，也可以在样式表中规定。 属性： align 用来设定段落的对齐方式。 取值有：left、right和center。 2 段落类标签（续上） 2.3 换行标签 格式：br 说明：此标签是不分段换行。只是插入一个简单的换行符。 br 标签是空标签，意味着它没有结束标签。 请注意，br 标签只是简单地开始新的一行 2 段落类标签（续上） 2.4 水平线标签 格式：hr 说明：该标签可以用来在页面上插入一条水平标尺线。 属性： align 用来设定横线放置的位置。取值有：left、right和center。 size 用来设定线条粗细，取值为n个像素，默认为2。 width 用来设定线段长度，取值可为绝对值（n个像素）或相对值（相对于当前窗口的百分比），默认值为100%。 3 列表类标签（