CSS 简单知识概括

标签：网站   type   :hover   ie8   position   css   知识   知识点   ati   

 CSS选择器

ID选择器

 #ID{color:red} 

类选择器

 .class{color:blue} 

属性选择器

注释：只有在规定了 !DOCTYPE 时，IE7 和 IE8 才支持属性选择器。在 IE6 及更低的版本中，不支持属性选择

 [title]{color:green} 

元素选择器

 p{font-size:15px} 

后代选择器

 p  a{font-size:15px} 

子元素选择器

 p > a{background:red} 

相邻兄弟选择器

 h1 + p{background:yellow} 

伪类选择器

 a:hover{color:red} 

网上流行的权重规则

内联样式：1000 + id选择器：100 + 类，伪类，属性选择器：10 + 元素选择器：1

盒子模型

盒子模型有两种，标准盒子模型和IE盒子模型（怪异盒子模型）

它们都有content（内容），padding（内边距），border（边框）和margin（外边距）

它们的的区别就在于，标准盒子模型，内容的长宽，即是盒子的长宽，IE盒子模型，内容+内边距的长宽=盒子的长宽

浮动属性相关

div{float:left}

属性包括：left，right，none，inherit

浮动元素会脱离标准文档流，浮动到其他元素上去，使用不当，还会造成浮动坍塌的问题，有兴趣可以去了解下

绝对定位和相对定位

a{position:absolute}

属性包括：static，absolute，relative，fixed

绝对定位absolute会脱离标准文档流，相对定位relative不脱离标准文档流，固定定位fixed同样脱离标准文档流

ps:这只是简单的资料概括，建议大家还是去专门的知识网站查阅，防止遗落知识点

CSS 简单知识概括

标签：网站   type   :hover   ie8   position   css   知识   知识点   ati   

原文地址：http://www.cnblogs.com/xianbin1996/p/6986581.html