Write excellent CSS Code

CSS is not difficult to learn, but in large projects, it becomes difficult to manage, especially the different people in the CSS writing style slightly different, the team is more difficult to communicate, this summed up some how to achieve efficient and neat CSS code principles:
1. Use reset but not global reset
The default properties for different browser elements are different, and using reset resets some of the browser element's default properties to achieve browser compatibility. Note, however, that you should not use the global reset:
*{margin:0; padding:0;}
This is not just because it is a slow and inefficient method, but it also causes unnecessary elements to reset the outer and inner margins. In this recommendation to refer to Yui Reset and Eric Meyer practice. I have the same view as Eric Meyer, reset is not the same, but also needs to be tailored to the different needs of the project to make appropriate changes to achieve browser compatibility and operational convenience. I use the reset as follows:
/** clears the inner and outer margin **/
Body, H1, H2, H3, H4, H5, H6, HR, p,
BLOCKQUOTE,/* Structural elements structural elements * *
DL, DT, DD, UL, OL, Li,/* list elements elements *
Pre,//formatting elements Text Format element * *
form, fieldset, Legend, button, input, textarea,/* form elements table cell
TH, TD,/* Table elements form elements * *
img/* img Elements Picture element */{
Border:medium none;
margin:0;
padding:0;
}
/** Set Default Font **/
Body,button, input, select, textarea {
font:12px/1.5 ' song Body ', Tahoma, Srial, Helvetica, Sans-serif;
}
H1, H2, H3, H4, H5, h6 {font-size:100%;}
Em{font-style:normal;}
/** Reset List Element **/
UL, ol {List-style:none;}
/** to reset a hyperlink element **/
a {text-decoration:none; color: #333;}
a:hover {text-decoration:underline; color: #F40;}
/** Reset Picture Elements **/
img{border:0px;}
/** Reset TABLE Element **/
Table {border-collapse:collapse; border-spacing:0;}

2. Good naming habits
There is no doubt that messy or semantically-named code, who will be crazy to see. It's like this code:
. aaabb{margin:2px;color:red;}


I don't think that even a beginner would have named a class like that in a real project, but have you ever thought that the code is also problematic:
The problem is that if you need to change all the original red fonts to blue, the changes will change to the style: