css学习笔记

还是在大一的时候接触的html，css。现在重新复习下。记录下我认为比较重要的注意点。

1. padding：会让盒子变大，padding的颜色就是背景的颜色，一个margin，padding，border的盒子究竟占了多大的空间？答案是，宽度是margin-left，margin-right，padding-left，padding-right，border-left，border-right，width之和，高度类似的方法计算

2. margin之间的重叠问题：

   1）如果是两个普通的元素，之间的margin取决于大的那个

   2）如果都是浮动的，之间的margin则是两个相加

   3）如果是父子元素，也会发生叠加

3. 内联元素：

   img就是一个特殊的内敛元素，但是他可以设置宽和高，而且和下面的div之间也有margin

   span也是一个内联元素，这里面设置宽高，上下边距是没有意思，它仅仅是包文字用的

   但是可以用display：block转化成内联元素

4. background：

1. background-image: url(); 指定背景图；默认是铺开

2. background-repeat:repeat-x /no-repeat指定沿着哪个方向重复

3. background-attachment:fixed; 图片一直固定在左上角

4. background-position：这个就可以把许多小图标放在同一张图片上

5. <a>

6. 对应有一个伪类，a：link，a：visted，a:hover，a:active（鼠标点击的一瞬间）  

        这是有着先后顺序的，顺序颠倒了则不能正常显示

    6 position

        absolute：绝对定位

        relative：相对定位

        fixed：固定定位（是绝对定位的一种）

        static：不定位，默认就是这个

        inherit：可以继承父元素的position的值

        相对定位元素仍然占据原来的空间，而绝对定位下面的元素会顶上来

    7定位机制：

        css中三种基本的定位机制： 普通流，浮动，绝对定位