今天师父上了第一堂课，讲了一些关于浏览器处理css的事儿。也算是一种好的习惯吧~

  1、页面上用到的一些背景图片，如果是一些比较小的图片，应该把他们合成到一张图片上，然后通过background-position来设置背景图片的位置。

     这样做的好处是：a、一张图片的大小会比很多张分散的图片小

                     b、这样可以一次加载完图片，比如你做按钮的普通和hover状态时，如果用两张图片，那么在一些浏览器下，hover的时候明显有一个空白再切换图片的过程，这样是无法满足我们的要求的。而如果合成一张图片，通过background-position就不会有这种问题了。

                     c、如果多个css样式都会用到合成的图片，那么最后将它们放到一起来设置它们的背景图片。如div1,div2{background:url(..),no-repeat;}IE6下不会缓存图片，这样的话就避免了每次读到一个样式的时候都要重新加载同一张图片

 

  2、写css样式的时候，应该按照（position|display|margin|padding等定位的样式）->（width|height|border|background等盒模型样式）->（color|line-height|font等内容样式）写 

     这是因为浏览器解析css的顺序：解析盒模型样式—>解析内容样式。

     如果你随便写/(盒模型样式->内容样式->盒模型样式)+/的话，那么浏览器就会 解析部分/(盒模型样式->内容样式->盒模型样式)+/。如此就比按顺序写多遍历了一次或多次，渲染的时候花费的更多。

 

  而且这样写的话在你下次看代码的时候也很容易一目了然。 所以一个好的习惯是很重要的。