跟着包子学 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边框限制，使得块状元素布局更加明显 下次说移动端适配