第0章HTML基础1.ppt

第0章 HTML基础 0.1 HTML概述 0.2 HTML标记 0.3 HTML表单的设计 第1节 HTML概述 2) HTML文件基本结构 HTML文档结构可以划分为两个基本部分：文件头(head)和文件体(body)。一个典型的HTML文档结构如图所示。 HTML基本结构： HTML HEAD title这是标题部分/title /HEAD BODY 你好，这是正文部分！ /BODY /HTML body/body 有很多的内置属性，这些属性用于设定网页的总体风格。例如，定义页面的背景图像、背景颜色、文字颜色以及超文本链接颜色等，主要属性如表所示。 实例3：预定义格式标记 HTML HEAD TITLE显示lt;pgt;与lt;pregt;的区别 /TITLE /HEAD BODY P春晓 春眠不觉晓，处处闻啼鸟。 夜来风雨声，花落知多少。 /P PRE春晓 春眠不觉晓，处处闻啼鸟。 夜来风雨声，花落知多少。 /PRE /BODY /HTML 实践训练：标题实例 HTML HEAD TITLE标题示例！ /TITLE /HEAD BODY text=#0000ff 。。。。 。。。。 /BODY /HTML 五、建立列表 1．有序列表 格式： OL type=符号类型 LI type=符号类型…/LI LI type=符号类型…/LI … /OL 功能：建立有序列表。 Type可取：A、a、1、i和I 2．无序列表 格式： UL type=符号类型 LI type=符号类型…/LI LI type=符号类型…/LI … /UL 功能：建立无序列表。 Type可取：disc(实心圆点)、circle(空心圆点)和square(实心方块) 3．自定义列表 除了上述两种列表以外，还可以根据需要自定义列表样式。格式为： DL DT…/DT DD…/DD DD…/DD ……. DT…/DT DD…/DD … /DL 六、注释标记 格式：!--注释内容--功能：注释标记。 实例：注释标记 HTML HEADTITLE标记的使用/TITLE/HEAD BODY !--注释 本程序的功能是： 制作简单网页熟悉基本标记的使用！ -- P align=center三种标记的使用！/P HR DIV align=center我在中间！BR中间/DIV HR DIV align=left我在左边！BR左边/DIV HR DIV align=right我在右边！BR右边/DIV HR/BODY /HTML 当使用IMG插入图像时，含有的属性如表所示 TD/TH的主要属性 实例： 标记属性 功能 align=alignstyle 设置对齐方式。alignstyle的取值为：left，right，center size =size 设置线条宽度（即高度） width=size 设置线条长度 color=colorvalue 设置线条颜色，默认为黑色 noshade 设置线条是否有阴影 表HR属性值 四、水平线标记hr标记是在HTML文档中加入一条水平线。? html head title图像与水平线的标记示例/title /head body hr width=600 size=1 color=#ff00FF p align=centerimg src=images/sun001.jpg alt=这里显示一张图片 WIDTH=160 HEIGHT=200/p hr width=600 size=3 color=#0000FF /body /html ol/ol标志对用来创建一个表有数字的列表 ul/ul标志对用来创建一个标有圆点的列表 li/li标志对只能在ol/ol或ul/ul标志对之间使用，此标志对用来创建一个列表项，若li/li放在ol/ol之间则每个列表项加上一个数字，若li/li放在ul/ul之间则每个列表项加上一个圆点。 实例：有序与无序 html head title/title /head body text=blue ol p中国城市/p li北京/li li上海/li li广州/li /ol ul p美国城市/p li华盛顿/li li芝加哥/li li纽约/li /ul /body /html 实践训练： dl/dl用来创建一个普通的列表 dt/dt用来创建列表中的项目名称 dd/dd用来创建列表中对项目的