跟着包子学 css (一)

1.在每次 写css之前 都应该先将浏览器的默认 样式 给清除掉
*{padding:0; margin:0;}
h1,h2,h3,h4,h5,h6{font-weight:normal; font-size:12px;}
li{list-style:none;}
a{text-decoration:none; color:#000;}
b,strong{font-weight:normal;}
i,em{font-style:normal;}
img{vertical-align:top;}
.fl{float:left;}
.fr{float:right;}
.clearFix:after{display:block; content:''; clear:both;}
.clearFix{zoom:1;}
input{border:0; padding:0; outline:none; background:none;}
textarea{resize:none;}
2.css的样式按照字母表的顺序排列 会更容易找到相应的属性
3.在写整体样式之前，应该根据设计稿来总结整个项目中一共有几种字体 ，几种颜色，几种字体大小，然后在css的最开头，制作内容表，当有需要用的时候就直接引用
4.不管是写JS还是CSS，注释都是必不可少的，他会让别人更加容易看懂你的样式代码和逻辑代码
5.在尽可能的时候使用css简写，在这里着重说一下background和font
background: color image repeat attachment position;
background: #f00 url(background.gif) no-repeat fixed 0 0;
font: font-style (italic/normal) font-variant (small-caps) font-weight font-size/line-height font-family;
font: italic small-caps bold 1em/140% "Lucida Grande",sans-serif;
6.在布局的时候，先给每个div都添加 border以用来确定容易和排版
7.层级嵌套不能太多，太多的时候会拖慢渲染速度，浏览器渲染原理是解析CSS的时候从右向左限制，若果层级太多，一遍遍遍历寻找就会拖慢速度
8.避免使用元素选择器，一些高频的元素去寻找的时候，就会拖慢速度
9.编写代码的时候要风格统一

所以这次是讲一下使用css的注意事项和规范
清除浏览器默认样式 - 风格命名统一（不要有大小写）-css能缩写就缩写 -开始布局的时候先用border边框限制，使得块状元素布局更加明显

下次说移动端适配