CSS学习总结系列3——XHTML中的CSS

XHTML中的CSS

1. 引用外部样式表：link元素 @important指令
2. 文档样式表：style元素
3. 内联样式表：style属性

引用外部样式表：link元素

link元素允许HTML创作人员将包含link元素的文档与其他文档相关联，CSS使用这个标记来链接样式表和文档。外部样式表不能包含任何文档标记，只能有CSS规则和CSS注释。

1. link元素与CSS相关的属性

1. rel（relation）:指定源文档到链接文档之间的关系，在这里关系为"stylesheet"。

2. type:代表引入文件的类型，在这里设置为"text/css"。

3. media：媒体选择属性,其中支持最广泛的类型是all、screen、print（Opera还支持projection（投影媒体，如幻灯片））。可以在多个媒体中使用一个样式，为此要提供应用此样式的媒体列表，各媒体用逗号分隔。

2. link元素在CSS上的应用

1. link元素必须放在head元素中。

2. 一个文档可能关联有多个链接样式表，文档最初显示时只会使用rel为stylesheet的link标记引入的一个或多个文档合并的规则。

3. 将rel属性的值设置为alternatestylesheet可定义候选样式表，还可以为候选样式指定title值来分组。

引用外部样式表：@import指令

@import指令除了XHTML中引入外部样式表，还可以用于外部样式表中引入其他的样式表。外部样式表不能包含任何文档标记，只能有CSS规则和CSS注释。IE浏览器错误的认为任何位置的@import指令都有效。

1. @import必须放在其他规则之前，在XHTML文档中，@import必须出现在style元素中。
2. 一个文档中可以有多个个@impor语句，每个 @import指令的样式表都会加载并使用。
3. 可以在@import指令的url之后列出要应用此样式的媒体，可以限制所导入的样式表应用于一种或多种媒体。
4. @import无法指定候选样式表。

例：@import url(sheet.css) all, print;

文档样式表：style元素

可以用style元素包含样式表，它在文档中单独出现。以<style type="text/css">开头，以</style>结尾。可以为sytle元素指定一个media属性。开可以用@import指令包含多个外部样式表链接。

内联样式表：style属性

除了在body外部出现的元素，任何元素都有style属性来指定样式。内联style属性的值只能是规则中出现在大括号之间的部分。通常不推荐使用style属性。