css3总结

1. box-sizing:  content-box||border-box;

content-box 传统模式W3C标准，width就是内容宽度

border-box  ie标准 width是内容+内边距(padding)+border

往往用在布局中，如果布局有padding或者border,导致原本100%宽度的并排元素出现问题，可以使用border-box来尝试布局。

2.text-overflow:clip||ellipsis

clip截断:配合overflow:hidden使用

ellipsis:末尾是“...”,配合overflow:hidden;white-space:nowrap一起使用

ellipsis在firefox上可能很有问题

3.border-image谨慎使用，因为我发现浏览器对其处理可能会和background混淆。情愿平铺了。反正以后我不用了。

4.@font-face: 字体详细介绍:http://www.w3cplus.com/content/css3-font-face

5.::selection:选中时候的样式

6.各种字体效果：http://www.w3cplus.com/blog/tags/11.html?page=9

7.media query：主要用来响应式布局

css中添加

@media screen and (max-width: 600px) {
    选择器 {
      属性：属性值；
    }
  }

link中添加

 <link href="css/reset.css" rel="stylesheet" type="text/css" media="screen" />
  <link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
  <link href="css/print.css" rel="stylesheet" type="text/css" media="print" />