首页 > 代码库 > CSS 简单知识概括
CSS 简单知识概括
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 简单知识概括