"六,关于Web标准的误区1,抛弃表格布局的思维方式当抽掉CSS文件,剩下的就是最本质的内容.这样才能在文本浏览器,手机,PDA等设备中阅读,才能随时修改CSS实现改版.2,正确使用XHTML标签XHTML的标签不是用来做"表现"的,而是用来定义结构的,因此,对不同的内容使用正确的XHMTL标签对于建立良好的文档结构是很重要的.何处使用
都要合理,这样不仅便于理解文档内容,同时对于CSS编写也很重要.3,关于理解CSS灵活的运用CSS选择器来进行CSS定义,将通用的样式写在外部CSS文件中,然后在页面内调用,同时还可以将不同的CSS定义在几个文件中.对于多次引用的样式可以用CLASS来定义,不需要每个元素都定义ID;也不是一定要用DIV,有的内容完全可以用
仅仅方便浮动.4,"通过验证"并不是最终目的W3C校验仅仅是帮助制作者检查XHTML代码的书写是否规范,CSS的属性是否都在CSS2的规范内.代码的标准化仅仅是第一步,不是说通过校验,网页就标准化了.让网页具有良好的结构,更快的浏览速度,更友好的界面以及对更多设备的支持才是最终目的.
第二节DIV+CSS做网站设计布局的优势分析
市场的需求往往引起这个行业得很大改革,文件下载与页面显示速度更快，使得很多网站已经开始重构Web，采用层（DIV）布局,并且使用层叠样式表（CSS）来实现页面的外观.一,Web标准:
是一系列标准的集合.
二,网页主要由三部分组成:
结构（Structure）,表现（Presentation）和行为（Behavior）.
三,对应的标准也分三方面:
a）结构化标准语言主要包括:
XHTML和XMLb）表现标准语言主要包括:
CSSc）行为标准主要包括对象模型:
（如W3CDOM）,ECMAScript等.d）根据W3CDOM规范是一种W3C颁布的标准,用于对结构化文档建立对象模型,从而使用户可以通过程序语言（包括脚本）来控制其内部结构.简单的理解,DOM解决了Netscaped的JavascriptMicrosoftJscript之间的冲突,给予WEB设计师和开发者一个标准的方法,让他们来访问他们站点中的数据,脚本和表现层对象.
四,采用标准的好处:
a）文件下载与页面显示速度更快.b）内容能被更广泛的设备所访问（包括屏幕阅读机,手持设备,搜索机器人,打印机,电冰箱等）.c）用户能够通过样式选择定制自己的表现界面.d）所有页面都能提供适于打印的版面.
五,采用标准对网民有者的好处如下:
a）更少的代码和组件,容易维护.b）带宽要求降低（代码更简洁）,成本降低.c）更容易被搜索引擎搜索到.d）改版方便,不需要改变页面内容.
六,什么是内容,表现,结构和行为a）内容就是制作者放在页面内真正想要访问者浏览的信息,可以包含数据,文档或者图片等.b）结构用结构将它格式化.分成标题,正文和列表等.易于阅读和理解.c）表现:
虽然定义了结构但是内容还是原来的样式没有改变.例如,标题字体没有变大,正文的颜色也没有变化,没有背景,没有修饰.所有用来改变内容外观的东西,称之为"表现".d）行为就是对内容的交互及操作效果,例如,使用Javascript判断一些表单提交,或者实现菜单的显示和隐藏等.HTML和XHTML页面都是由"结构,表现和行为"这三方面组成的.内容是基础,然后是附加上去结构和表现,最后再对它们加点"行为".
七,DIV与CSS结合的优势
八,传统的HTML3.2/4.0标签里既有控制结构的标签,如
等,也有控制表现的标签如;等,还有本意是用来控制结构却被用来控制表现的标签,结构与表现标签混杂在一起.九,网站制作者往往会遇到如下问题:
1，,改版:
例如需要把标题文字替换成红色,下边结变成一像素灰色的虚线,那么就要一页一页的修改.CSS的出现,解决了"批量修改表现"的问题,最广泛的被制作者接受的CSS属性,例如,控制字体的大小颜色,超链接,表格的背景色等.
2,数据的利用:
本质上讲,所有页面信息都是数据,例如,CSS所有属性的解释,就可以建立一个数据库,数据就存在数据查询,处理和交换的问题.由于结构表现混杂在一起,装饰图片,文字被层层的表格嵌套拆分.从哪里开始是标题,从哪里开始是说明,哪些是附加信息不需要打印?
如果靠软件是无法判断的,唯一的方法是人工处理.这要如何解决呢,就是要内容,结构与表现分离.例如
说明资料
h1{font:"宋体"14px;color:
#000;border-bottom:
1pxsolid#CCC;}如果把上例改为红色,粗体,下边线为红色虚线可以直接修改h1的样式h1{font:
"宋体"14pxbold;color:
#F00;border-bottom:
1pxdashed#F00;}
第三节
一,HTML与XHTML打开一个网页,查看它的源代码,就会看到一些有规律的英文代码,这些组成网页的代码就是——超文本链接标示语言（HypertextMarkupLanguage,html）"超文本"就是指网页内包含图片,链接甚至音乐,程序等非文字元素,"标示"就是说它不是程序,只是于文字及标记组合而成.浏览器或其它可以浏览网页的设备将这些"HTML"语言翻译过来,并照定义的格式显示出来,转化成最终看到的网页.二,常用的HTML标签1,标题
到2,段落段落内也可以包含其他的标签,如图片标签![]()
,换行标签
,链接标签等3,换行标签
强制换行为了向XHTML过度,最好养成关闭标签的好习惯,为空标签加上"/"如![]()
4,链接链接可以分为超链接和锚点,这两种标签都是使用锚标签来建立.链接文字5,列表有三种无序列表,列表项目前面有黑色的圆点有序列表,列表项目前面有数字序号.
释义列表是一列事物以及与其相关的解释.
6,图片图像（images）是由![]()
标签定义的,![]()
也是一个空标签.给页面的图像都加上alt标签是一个好习惯,它有助于更好的显示信息,而对纯文本浏览器或者关闭了图片显示功能的浏览器会很有用.注:不加alt标签,就不能通过w3c布局校验.7,表格表格的
| 等标签都可以设置宽度,高度,背景色等多种属性.可是一般不推荐在HTML内定义这些属性,而应将其统一定义到CSS样式表内,以方便 修改.8,层层（div）称为定位标记,其作用是设置文字表格图片等的摆放位置. 若想灵活地使用层来布局页面,就要深刻理解层的含义,它和表格,标题等标签不同,它没有实际的意义,只是一个"容器",用来放置其它元素,然后利用CSS样式从而布置这个容器的摆放位置.9,范围范围（span）和层的作用类似,只是标签一般应用在行内,用以定义一个小块需要特别标示的内容,标签需要通过CSS样式表才能发挥作用.10,框架使用框架（Frames）,可以在一个浏览器窗口中显示多个页面.所有的框架都放在一个总的HTML文件中,这个档案只记录了该框架如何分割,不会显示任何资料,所以没有标记,浏览器通过解释这个总文件而将其中划分的各个框架分别对应的HTML文件显示出来. |
|---|