读《网站重构》(5):CSS解析

时间：2010-08-27 来源：tztztz

读《网站重构》(5):CSS解析

一个样式表，是一个集合，一个由一个或多个规则定义组成的集合，这些定义将决定被选中的元素如何被显示。

一个CSS定义由两部分组成：选择器和声明。其中，声明是也是一个集合，集合元素放在一对｛｝内，每一元素以";"结束，每个元素由两部分组成：属性和值，属性和值之间用": "分隔。

以#开头的选择器，为id选择器，以.开头的选择器为选择器。

多个选择器可以共享同一声明，这时不同选择之间以逗号分隔。

根据CSS，页面的子元素从母元素继承特性，但有些旧浏览器不支持（如Netscape 4）。如果不想让子元素继承母元素特性，则子元素可自由定义相关属性。

CSS不区分大小写，但当与一个HTML文件关联时，类别和id名称是区分大小写的。

为了便于编辑CSS,可以增加一些空格或换行符。

样式表可以通过三种方式作用于页面的显示

外联/导入

<link rel="StyleSheet" href="/styles/mystylesheet.css" 
type="text/css" media="all />
或
<style type="text/css" media="all">
 @import "/styles/mystylesheet.css";
</style>
或
<style type="text/css" media="all">
 @import url("/styles/mystylesheet.css");
</style>
注：@Import 法只有5.0以上的浏览器支持

嵌入（在XHTML页面head位置嵌入）
```
。。。
<head>
。。。
<style type="text/css">
<!-
 …..
-->
</style>
…..
</head>
…..
```
使用嵌入的原因：
- 该样式表只用于本页面
- 用户还在使用IE3
- 设计师不断修改样式表，需要立即看到效果
内联（在元素上加上样式属性）