CSS基本概念:
选择器{属性:值;属性:值}
CSS继承:子元素继承父元素样式,父子关系看DOM结构。
CSS覆盖:
- 浏览器缺省设置
- 外部样式表
- 内部样式表(位于 <head> 标签内部)
- 内联样式(在 HTML 元素内部)
CSS优先:
A:文本从上到下,后声明的样式优先于前面出现的同一样式例:.a{background:black;}.b{background:yellow; }<div class=” b a″>dd</div>结果:所有浏览器均yellow色,注意:与class=”” 引号内的顺序无关,只看.def1和.def2在声明时的顺序,.def2后声明,所以权重高
B:id声明 > class声明 > 标签声明(即HTML固有标签,例如 div)
C: ‘!important’ 相当于无限重量
<style>
#wrapper
{
width:
100px!important; /* IE7+FF */
width: 80px; /* IE6
*/
}
</style>
IE6不支持!important,可以使用它对IE6做Hack
通过以上我们可以观察到,CSS更象是一个可视化的面向对象编程,拥有类定义,选择,继承,覆盖,优先级别,可以说CSS是一种声明式的,更好的面向对象编程。
1.CSS选择
基本选择:
.是按类名选择,#是按ID选择,没有前缀就是按元素选择,*选择所有,
2.盒模型
3.行模型
3.CSS浮动
4.CSS布局
5.CSS对齐
6.CSS字体
7.CSS伪类伪元素
8.CSS颜色,背景
9.CSS边框,阴影