1、,第3章,如何建立结构化文档,预习检查,标签表示什么？ 无序列表用什么标签表示？列表项用什么标签表示？,简要介绍,所谓结构化文档是采用XHTML通用元素标签将页面划分成不同的区域或块，然后在不同的区域或块中填充内容，如报刊杂志版面设计一样。,主要内容,3.1 XHTML通用元素 3.2 基本的XHTML元素 3.3 XHTML文本格式化 3.4 XHTML列表 3.5 叮叮书店首页结构化文档,XHTML通用元素 标签,可定义文档中的分区或节（division/section），简称块，div是division的简写，division意为分割、区域、分组。标签可以把文档分割为独立的、不同的部分，
2、如果用id或class来标记，那么该标签的作用会变得更加有效。 是一个块级元素。如下面代码：这是一个标题块状元素的宽度为100，而且后面隐藏附带有换行符，使块状元素始终占据一行。,XHTML通用元素标签,标签被用来组合文档中的行内元素。 使用来组合行内元素，如： 一些文本一些其它文本 行内元素没有高度和宽度，因此也就没有固定的形状。,基本XHTML元素,基本XHTML元素标题,标题使用 至 标签进行定义。 定义最大的标题。 定义最小的标题。 这是一个标题 这是一个标题 这是一个标题 这是一个标题 这是一个标题 这是一个标题 XHTML 会自动在标题前后添加一个额外的换行。,基本XHTML元素段
3、落,段落使用 标签进行定义。 这是一个段落 这是另一个段落 XHTML 会自动在段落前后添加一个额外的空行。 当打算结束一行，而又不想开始一个新段落时， 标签就派上用场了， 标签会产生一个强制的换行。 这是一个段落被换行,基本XHTML元素注释,注释标签用于在 XHTML 源码中插入注释。注释会被浏览器忽略。可以使用注释对代码进行解释。左括号后需要写一个惊叹号，右括号前就不需要了。,XHTML文本格式化文本格式化标签,实例xhtml (format).html,XHTML文本格式化文本格式化标签,XHTML文本格式化“计算机输出”标签,实例xhtml(pre).html使用了pre标签对空行和
4、空格进行控制，实例xhtml(code).html列出了不同“计算机输出”标签的显示效果。,XHTML文本格式化“计算机输出”标签,XHTML文本格式化引用和术语定义,实例xhtml(address).html说明了如何在 HTML 文件中写地址，如何实现缩写或首字母缩写，如何改变文字的方向。,XHTML文本格式化引用和术语定义,XHTML列表,XHTML 支持有序、无序和定义列表。,XHTML列表无序列表,无序列表是一个项目的列表，此列项目使用粗体圆点（小黑圆圈）进行标记。无序列表始于标签，每个列表项始于，列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。 实例xhtml(ul).
5、html使用了无序列表。,XHTML列表有序列表,有序列表也是一列项目，列表项目使用数字进行标记。有序列表始于标签，每个列表项始于标签，列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。 实例xhtml(ol).html使用了不同类型的有序列表。,XHTML列表定义列表,自定义列表不仅仅是一列项目，而是项目及其注释的组合。自定义列表以标签开始，每个自定义列表项以开始，每个自定义列表项的描述以开始，定义列表的列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。 实例xhtml(dl).html使用了定义列表。,叮叮书店首页结构化文档,用确定文档的结构 整个页面使用一个，分成三个部分页头、页体、页脚，页体又分成左边、右边两部分。页头页体页体左边页体右边页脚 ,叮叮书店首页结构化文档,填加文本内容 页头显示网站logo和导航菜单。网站logo和导航菜单也分别放在中，导航菜单使用了无序列表。页体左边显示本周推荐和最近新书栏目。页体右边显示促销、分类和关于书店栏目。页脚显示网站联系及版权标志。实例index1.html。,总结,XHTML通用元素 文本元素 列表,预习,第4章 正确使用超链接,
