CSS 中文在线手册

最近，我不得不对我的一个客户的旧网站进行更新，使得它能够达到可访问性的标准。对三四年前的旧代码进行挖掘的想法根本没有吸引力，主要是因为我曾经使用的很多编程惯例已经不再适用，特别是从可访问性上来讲。我曾经使用绝对的字体大小，固定的页面宽度和表格来做版面设计和空间分配。
像那时建构的很多网站一样，我的客户的网站使用了Cascading Style Sheets (CSS)来格式化文本。它没有使用

table元素
如果你已经看过我的代码，就会发现我的日历是用table做的。不错，因为日历中显示的是表列数据，所以这样说来用table布局是合理的。而用table定位制作整个网站是不合适的，但我们完全可以有针对性的将table用在列表数据当中。像日历，程序表，图表，时间表我们都可以用table制作。此外试想一下，如果没有引用CSS，那些用CSS控制的浮动对象和绝对定位的对象会把页面变得一团糟。事实上，在我处于用CSS布局狂热的状态下，曾经试着不用t

原文链接：CSS Design: Custom Underlines
　　由 A List Apart 杂志及作者授权翻译。（Translated with the permission of A List Apart Magazineand the author[s].）
　　说明：文章中“[补充]”内容系译者所补充添加（来自 CSS 2.

你正在学习CSS布局吗？是不是还不能完全掌握纯CSS布局？通常有两种情况阻碍你的学习：
第一种可能是你还没有理解CSS处理页面的原理。在你考虑你的页面整体表现效果前，你应当先考虑内容的语义和结构，然后再针对语义、结构添加CSS。这篇文章将告诉你应该怎样把HTML结构化。
另一种原因是你对那些非常熟悉的表现层属性(例如：cellpadding,、hspace、align="left"等等)束手无策，不知道该转换成对应的什么CSS语句。当你解决了第一种问题，知道了如何结构

字体的处理在网页设计中无论怎么强调也不为过，毕竟网页使用来传递信息的，而最经典最直接的信息传递方式就是文字，所以，了解一点字体的基本知识对于设计来说还是非常重要的。
中文和英文的最大区别就是中文是方块字，英文是拼音文字，这对字体的处理的影响是巨大的。看看下面的图示就会发现，英文字体里的那些变化在中文字体里都弱化了。

原文作者：Douglas Bowman 原文出自：A List Apart 中文翻译：54player.com nobita 版权说明：本文中文翻译版权归译者54player.com nobita所有。需要转载发表的，请先与作者联系
在CSS中，一个经常被人们讨论的先进之处即背景图像的可层叠性，并允许他们在彼此之上进行滑动，以创造一些特殊的效果。根据CS

现在，用ＦＲＯＮＴＰＡＧＥ制作网页简单得就象是用画笔在白纸上画图一样。但随着网站内容的不断丰富，网页上的图象、动画、字幕以及其他控件也不断增加，要实现这些元素在网页中的准确定位，就必须对这若干个元素分别调整，这一点恐怕只有那些对网页制作痴迷而执着的人才可能做到，这并不是正确的工具和灵活性就可以实现的。设想一下，打开一个文本文件，编辑几行字，就可以使整个Web站点得到改变。再设想一下，以在线的方式创建带有复杂图形、丰富字体字号等特殊效果的页面，大小只有10k。那么这样的效果如何实现呢？
　　19

DIV与TABLE本身并不存在什么优缺点，所谓web标准只是推荐的是正确的使用标签，好比说：DIV用于布局，而TABLE则本来就是转二维数据的。让TABLE做该做的事，并不是说页面里不出现TABLE就是多么多么牛。
用DIV进行排版的优势就是我不说，大家应该都比较清楚。DIV是标准，是大势所趋，但并不意味着所有的页面都适合用它来做。
中国的门户和国外的有很大的区别，中国网民并不喜欢信息量少的页面，YAHOO到了中国页面上的内容就多了不少，而上次改为简洁的页面后访问量下

　　很早5key就在公司进行CSS框架的架构，也对不少朋友提出CSS框架的建议。效果是很明显的。当然，CSS框架有利也有弊，最近也看了一些相关的文章。一些感想，与大家分享。
CSS框架之利：
1、开发效率的提高。
　　如果你是一个企业建站的前端开发，相信在大部分时间里进行着同类站点的代码工作。定义好的框架可以大大提高你的工作效率，避免一些常见的错误。如果你的工作是按件计费的，你的报酬一定会比别人多。

我已经习惯了做好页面之后去解决不同浏览器的兼容性问题，不断的测试，不停的修改CSS hack以保证在大部分的浏览器上得到最佳效果。光IE就需要兼顾IE5.X与IE6，以后也许还要为IE7来写单独的CSS hack，或许是这样的工作做得多了开始讨厌这样的没有效益的劳动。就是为了去满足那些少数的IE5.0用户或是为了满足那些极端的Firefox或是Opera的推崇者们，我需要花费多一倍的时间来研究这些，我开始思考当浏览器不断成长，不断更新，我们的CSS hack是不是要没完没了的写下去，并且越写越多？I

伪类（Pseudo classes）是选择符的螺栓，用来指定一个或者与其相关的选择符的状态。它们的形式是selector:pseudo class { property: value; }，简单地用一个半角英文冒号（:）来隔开选择符和伪类。
CSS很多的建议并没有得到浏览器的支持，但有四个可以安全使用的用在连接上的伪类。
伪类
伪类（Pseudo classes）是选择符的螺栓，用来指定一个或者与其相关的选择符的状态。它们的形式是selector:pseudo

CSS的组合和嵌套
组合
你不必重复有相同属性的多个选择符，你只要用英文逗号（,）隔开选择符就可以了。
比如，你有如下的代码：
h2 { color: red; }
.thisOtherClass { color: red; }
.yetAnotherClass {

相对长度单位  Relative Length Units
em
说明：相对长度单位。相对于当前对象内文本的字体尺寸。
如当前行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。
示例：
div { font-size : 1.2em; }
ex
说明：相对长度单位。相对于字符“x”的高度。此高度通常为字体尺寸的一半。
如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。
示例：

Selectors
选择符 CSS Version
版本 Compatibility
兼容性 Syntax Samples
语法 Description
简介
类型选择符(Type Selectors) CSS1 IE4+ , NS4+ E1 以文档语言对象类型作为选择符
通配选择符(Universal Selector) CSS2 NONE * 选定文档目录树（DOM）中的所有类型的单一对象
包含选择符(Descendant Selectors