<link rel="stylesheet" type="text/css" href="sheet1.css" media="all" />
其中得到广泛支持的三个媒体类型：all、screen和PRint，可以通过逗号同时设置多个媒体类型，例如"screen,print"。
rel是relation的意思，还可以设置为"alternate stylesheet"作为候选样式表，只有在用户选择这个样式表的时候才会显示。
link还有一个title属性：如果为一个rel为stylesheet的link指定了title属性，则该样式表作为首选样式表；
指定多组首选样式表，那么只会其中的一个作为真正的首选样式表，另外的会被忽略，至于是哪一个作为真正的首选样式表，无法确定。
<style type="text/css">@import url(sheet2.css) all;@import url(http://www.test.com/c/a.css) print;body{color:red;}</style>CSS要求@import指令出现在样式表的其他规则之前，如果出现在其他规则之后则会被忽略（但windows平台的IE不会忽略任何@import指令）。
另外还有些浏览器本身的限制：IE有个CSS 32样式限制BUG，排在第32个以及之后的<style><link>或者@import将会被忽略。
尽量避免使用@import，IE下LINK可能会导致@import加载的阻断；还可能导致资源文件下载顺序被打乱，例如后声明的<script>却提前于@import中的CSS被加载了；
在IE中，如果因为加载 <script>导致的LINK中的@import阻塞加载，那这时会因为CSS未加载完全，IE不会在页面渲染任何内容，导致用户体验极差。
元素选择器 html{padding:0px;margin:0px;}
选择器分组 h1,p{color:#444;}
通配选择器 *{color:green;}
类选择器 .warning{font-style:italic;} p.warning{font-style:italic;}
多类选择器 .warning.uragent{color:red;} p.warning.uragent{color:red} /*同时包含这两个类名的元素，类名的顺序不限，IE6只识别多类中的最后一个类*/
ID选择器 #first-w{color:red;} /*类选择器和ID选择器可能是区分大小写的，取决于文档语言，例如HTML和XHTML的类和ID区分大小写*/
后代选择器 ul ol em{color:red;} /*ul和ol元素之间的层次间隔可以是无限的*/
CSS2引入了属性选择器，IE6不支持属性选择器，IE7支持所有CSS2.1属性选择器，还支持一些CSS3属性选择器。
简单属性选择器 h1[class][title]{color:red;} /*存在class属性且存在title属性的h1元素的文本都为银色*/
根据具体属性值 a[href="#"]{color:red;}
以某属性值开头 p[class^="fix"]{color:red;}
以某属性值结束 p[class$="fix"]{color:red;}
属性值包含子串 p[class*="fix"]{color:red;}
根据部分属性值选择 p[class~="waring"]{color:red;} /*属性值中用空格分隔，存在waring的p元素*/
特性属性选择器 p[class|="fix"]{color:red;} /*class为fix或者fix-开头的p元素*/
子元素选择器 h1>strong{color:red} /*strong元素的父元素为h1时才显示为红色*/
选择相邻兄弟元素 h1+p{color:red;} /*h1和p有共同的父元素，p紧接着出现在h1之后*/
伪类（CSS1） :link:visited，:link应该标记的是未访问的链接，但有的会标记访问的和未访问的所有链接。
动态伪类（CSS2） :focus:hover:active，动态伪类可以应用到任何元素。
支持程度：IE6只允许动态伪类选择超链接，IE7支持所有元素应用:hover但不支持对表单元素应用:focus样式。
伪类的组合在IE6中也无法被支持，例如a:link:hover{}在IE6中相当于a:hover
静态伪类（CSS2） em:first-child{color:red;} /* 会匹配在父元素中作为第一个元素的em */
伪元素选择器（CSS2）会在指定位置添加伪元素进行修饰：
p:first-letter{color:red;} 向文本的第一个字母添加特殊样式。
p:first-line{color:red;} 向文本的首行添加特殊样式。
h2:before{content:"}}";color:red;} 在元素之前插入生成的内容，并设置样式。
h2:after{content:url(logo.gif);color:red;} 在元素之后插入生成的内容，并设置样式。
选择器中给定的各个元素和伪元素：0,0,0,1
选择器中给定的各个类属性值、属性选择或伪类：0,0,1,0
选择器中给定的各个ID属性值：0,1,0,0
结合符和通配符选择器对权重没有贡献。
div#sidebar *[href] {color:red}如上例子的特殊性为：0,1,1,1。
每个内联样式的特殊性都是1,0,0,0（为内联样式保留一位是CSS2.1才新增的，在CSS2中内联样式的特殊性是1,0,0，所以ID选择器很容易覆盖内联样式）。
CSS2.1中还可以声明一个样式为!important作为重要规则：p.desc{color:#09f !important;background:#eee !important;}
样式通常可以继承，例如颜色，继承的样式是没有特殊性的，因此例如用户代理的超链接样式就优先于继承过来的样式。
按照权重，样式声明排序：读者的重要声明>创作人员的重要声明 >创作人员的正常声明>读者的正常声明>用户代理声明。
伪类 :link{}:visited{}:hover{}:active{}的顺序特别要注意，因为所有链接要么是未访问要么是已经访问。
对于继承，CSS2.1中有一个关键词是所有属性公有的，就是inherit。例如期望一个段落中的a标签的文字颜色和段落文字颜色相同，则可以：
p{color:#09f;}p a{color:inherit;}颜色rgb(75%,1000%,-1000%)会被自动处理为rgb(75%,100%,0%)。
相对长度单位em：假设一个h1的字体大小为24px，那么如果设置该元素的左边距为1em，则实际值为24px。
相对长度单位ex的历史：很多用户代理的做法是取em的值的一半作为ex的值，随着时间的推移，更多的用户代理会使用ex的实际值（小写x的高度）。
字体系列：CSS定义了5种通用字体系列：Serif、Sans-serif、Monospace字体、Cursive字体、Fantasy字体，理论上任何安装的字体都会落入这里的通用字体中。
font-size实际上相当于为给定字体的em框提供一个大小，而不能保证实际显示的字符就是这种大小。
font-size除了可以使用larger和smaller来指定相对父元素的大小外，还可以通过百分数大小（和em的作用差不多）。
font-size是可以继承的，继承的是计算值而不是百分比。
font-variant只有两个非继承值：normal和small-caps，small-caps要求使用小型大写字母文本（有的浏览器直接显示为大写）。
font属性例如h1{font:bold normal italic 24px Verdana,Arial;}的前三个值可以采用任何顺序，后两个值必须存在且font-size必须在font-family之前。
line-height属性可以单独设置，也可以h1{font:bold italic 200%/1.2 Verdana;}通过斜线的方式描述。
重新定义font样式时，所有被忽略的值都会重置为默认值。
可以使用系统字体：.ca{font:caption;}，此外还有caption、icon、menu等。
@font-face感兴趣可以去了解下，例如可以下载远程字体。
text-indent属性可以为块级元素中的第一行进行缩进；该属性会继承；在CSS2.1之前，text-indent总是继承计算值，而不是声明值。
text-align属性可以为块级元素中的文本行进行水平对齐。
line-heigth属性在应用到块级元素时定义了元素中文本基线之间的最小距离，而不是一个绝对数值；
line-height属性并不影响替换元素的布局，不过确实可以应用到替换元素。
文本行中的每个元素都会生成一个内容区，这由字体的大小确定，这个内容区会生成一个行内框，line-height会增加或减少行内框的高度。
line-height的继承，line-height值从父元素继承时，要从父元素计算，而不是在子元素上计算；更好的办法是指定一个数作为缩放因子：
body{font-size:10px;}div{line-height:1em;}/*10px*/p{font-size:18px;}如上的CSS会导致行间距太小，可以这么修改：
body{font-size:10px;}div{line-height:1;}/*这样值会根据每个元素的font-size计算得到*/p{font-size:18px;}vertical-align使用百分比会根据元素的line-height值来计算。
vertical-align会影响行高，垂直对齐的文本并不会覆盖其他行中的文本，行框会足够大到包含行内最高行内框的顶端和最低行内框的底端。
如果为letter-spacing指定一个长度值，字符间隔则不会受text-align影响。
无法为Word-spacing或letter-spacing定义一个可继承的缩放因子来取代计算值（像line-height那样），因此可以：
p{letter-spacing:0.25em;}small{font-size:50%;letter-spacing:0.25em;}text-decoration可以一次指定多个修饰：a:link{text-decoration:underline overline;}，该属性不继承。
white-space处理空白符，其中的值pre-wrap和pre-line是CSS2.1中新增加的。
white-space的nowrap不允许自动换行。
宽度，边框，内边距，外边距中，只有外边距可以为负数。
如果垂直格式化的高度小于显示内容所需的高度，浏览器可能会向元素增加一个滚动条。
百分比高度的问题：一个正常流元素的height设置为一个百分数，这个值会根据包含块设置的高度进行调整，如果包含块没有显示声明高度，则百分比高度重置为auto。
垂直相邻外边距在元素没有内边距和边框的情况下会合并。
如果向行内的替换元素应用外边距，会影响行高。
CSS2.1规定元素的背景是内容、内边距和边框区的背景；边框宽度不能指定为百分数。
background-attachment可以设置值为scroll或fixed，如果为fixed则可以固定显示。
浮动元素的外边距不会合并。
浮动元素会生成块级框，即使元素本身是行内元素。
* html{overflow: hidden;position: relative;left: 0px;top: 0px;width: 100%;height: 100%;}* html body{width: 100%;height: 100%;overflow: auto;padding: 0px;margin:0px;}* html .fixed{position: absolute;}固定的左右分栏
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <style type="text/css"> 6 *{margin: 0px; padding: 0px;} 7 #c{width: 760px; margin: 0px auto;} 8 #header{height: 100px; background: #eee;} 9 #main{10 float: left;11 padding: 10px 0p
新闻热点
疑难解答
