CSS 掏粪箱（1）

居中

1.display 属性为 block 的元素水平居中

block {
      margin: 0 auto;
}

2. display 属性为 inline、inline-box 的元素居中

  inline， inline-block {
      text-align: center;
  }

p.s. 一般来说，block、inline-block 的元素可以设置宽高，inline 的元素不可以设置宽高，但是也有特殊情况，例如 img标签、input标签等。

定位 position

position : static

这是默认的 position 属性值

position : relative

相对定位 ： 相对定位的元素可以通过 top, left, right, bottom等属性改变它相对于其默认位置的位置。

写一个质能方程式 ：

    
    
    
    


    
E = MC2
    

质能方程式的平方在右上角

position : absolute

绝对定位 ： 并非真正的绝对定位，他会脱离当前的位置寻找“靠山” —— 它向上寻找父级、爷级、祖宗级标签 position 不为 static 的标签，依附它的位置，通过 top, left, right, bottom 来定位它的位置。

实现一张图片上的“叉叉”关闭按钮

广告上面的关闭按钮

position : fixed

可以用来实现网页上的广告效果，无论你怎么滑动窗口，他始终在界面上的固定位置，想躲都躲不掉。

写一个特讨厌的广告

侧边广告

boder-radius

用来给 block 块级元素增加圆角，可以用来实现圆形头像。

写一个圆形头像

圆形头像