当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > 标准化你的网页

CSS样式表
网页页面原结构和CSS写法导致浏览器兼容问题
CSS经验:ul列表不正确使用的趋势
Styleneat帮助你容易阅读和更新CSS文件
CSS的内容注释和作者及文件版本注释
网页设计制作教程:CSS书写格式
将CSS按照层叠式结构化重新组织与构建
CSS教程之CSS盒模型
CSS 框架BlueTrip特性
IE7和FF浏览器中右下角图片广告
CSS实例:通过定义渐变边框给图片加阴影
网页选项卡TAB设计原则和应用案例教程
8个设计规范的表格Table CSS样式应用
CSS制作的背景动态变化的网页导航
网页选项卡TAB设计原则和应用案例教程
使用CSS给图片添加阴影的方法
WEBJX收集20个高质量的免费CSS模板
13个网页页面浏览器兼容性验证工具
11个用CSS样式表制作网页按钮的教材
CSS3属性使网站设计增强同时不消弱可用性
清理无用的CSS样式的几个有用工具

CSS样式表 中的 标准化你的网页


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-12   浏览: 79 ::
收藏到网摘: n/a

Web标准是越来越突出了,现在建站都讲究个符合标准,通过W3C的XHTML和CSS验证,那么怎样才能做出一个符合标准的站点呢,下面是我在BLOG重构和制作OSdev Resource过程中的一些经验^_^。

网页设计师看一些有关Web标准方面的文章

虽然w3.org更权威,但对于母语是中文的我们来说,这个更容易看懂:)个人觉得比去w3.org看那些满屏的E文舒服。可以在这里找到很多有关XTHML,DIV+CSS布局,CSS技巧等的文章。还有站长阿捷写的《循序渐进》的教程,介绍了怎么一步一步来制作一个符合标准的网站。

丢掉table,采用div+css布局

这似乎是设计一个符合标准的网页首先应该做到的了:),DIV+CSS布局也是一种趋势。用DIV+CSS布局可以参考w3cn.org的文章:CSS基本布局16例典型的三行二列居中高度自适应布局

关闭标签

在以前,可能我们并不注意关闭标签这个问题,例如img,p等,在用这些标签时往往只用了开头,而没有正确的关闭它。通常情况,我们是这样用img的:

<img src="sample.gif">

但是在XHTML中,不允许这样的情况存在,而是应该关闭它:

<img src="sample.gif" />

再者如段落标记<p>,以前用它都是直接一个<p>,而没有想过在段落结束时加上</p>,这在XHTML也是不允许的。

正确嵌套标签

浏览器的容错性使得我们在编写了一个不符合规则的网页也能得到正确的显示效果,如用

<p><b>sample</p><b>

并没有什么问题,同样的,这在XHTML中是不被允许的。XHTML从XML而来,而XML必须具有结构性,所以嵌套标签时,必须一层一层嵌套,而不能交错。

正确设置字符集

似乎没有什么大关系,但设置好字符集更有利于浏览器对文档的解析。

图片的对齐

在XHTML中,align属性只能是left、middle、right或者top、middle、bottom这三个值中的一个,而很多时候我们需要图片与文本绝对中间对齐,即用absmiddle。使用XHTML之后,就要丢掉这个属性了,解决方法?我也不知道,不过网页设计师里有文章有提到这个问题,我在BLOG重构时,把图片对齐一律设为top,显示效果也还过得去。

处理链接中的&

动态网站中在用GET方法传参时,如果有多个参数,就会用到&来连接各个参数,但在XHTML中如果有&就意味之后是一个实体,但是应该没有人会把参数名取nbsp、lt、gt这样的吧。在XHTML中规定所有不是实体的&必须转换成&,如果不进行转换的话,在进行W3C校验时就会报错找不到实体。

其实个人感觉按照标准来制作网站比按传统方式来制作网站轻松很多,因为结构与内容分离,在改变显示效果时不需要整个页面重新做过,只需要在CSS中重写样式就行了。而且方便以后改版什么的,再者如Fdream的FBS,无刷新换肤,不错的东东~~