《CSS权威指南》双鱼书概述——第一章CSS和文档

前言：CSS即层叠样式表 主要是影响一个或者一组文档的表现，没有文档，CSS毫无用处。

一、web的衰落

完全结构化的文本太过古板，太平常，虽然有N个理由要求使用结构化标记，但HTML已然走到了今天。

二、CSS做救星

丰富的样式，易于使用，在多个页面上使用样式，层叠，缩减文件大小，为未来做准备，所以CSS有更加丰富的外观，在一个位置上就能修改和创建整个文档的外观，可将样式表链接到网站上所有的文档，同时还规定了冲突规则，这些规则统称为层叠。 同时可以缩减文件大小，为将来做准备。

三、元素

元素时文档结构的基础，可以分为如下几类：

1》替换元素和非替换元素。

替换元素时指用来替换元素内容的部分并非由文档内容直接表示。如img元素。 input元素等。

大部分的HTML和Xhtml元素都是非替换元素，如span，h1~h6标题标签，表单元格，列表和Xhtml中的几乎所有的元素都是非替换元素。

2》元素显示角色

块级元素和行内元素。

块级元素生成一个元素框，会填充父元素的内容区，在元素框之前和之后生成了“分隔符”。如p，div元素，替换元素可以是块级元素，但通常都不是。

行内元素

行内元素在文本行内生成元素框，而不会打断这行文本，如a标签，strong和em也属于。

区别：在HTML和XHTML中，块级元素不能继承自行内元素，级不能嵌套在行内元素中。但是在CSS中，对于显示角色符合嵌套不存在任何限制。 即行内元素可以继承块元素，块元素可包含行内元素，反之不行。

四、结合CSS和XHTML。

即如何引用css，方法有：

1》link 标记

即 < link rel="stylesheet" type="text/css" href="sheet1.css" media="all"> 利用外部样式表，需要注意的是link必须放到head元素中，这个外部样式表中不能包含XHTML或任何其他标记语言，只能有样式规则和css注释。

属性

rel代表关系relation，关系为stylesheet，type总是设置为text/css ,href="外部样式表的位置" media的值是all表示要应用于所有表现媒体。aural 用于语音合成器，屏幕阅读器，和文档的其他声音表现等等。

如果一个文档要关联多个样式表，需要加载多个link标记。

候选样式表

将rel的值设为 alternate stylesheet，可以供用户进行选择。

2》style元素，在文档中单独出现

<style type="text/css> ...</script> 成为文档样式表或者嵌套样式表。

3》@import 指令

@import url（sheet2.css）用于加载外部样式表。 @import 出现在style容器中，还要放到其他的CSS规则之前，否则根本不起作用。

link和@import的区别：

每个@import指令的样式都会加载并使用。

4》内联样式

<p style="color:gray";>,除了body外部出现的标记，如title何head等，style属性可以与其他任何的HTML标记关联。

5》CSS注释

单行注释，多行注释，CSS注释不能嵌套。