[04] Precautions for css development and 04css

[04] Precautions for css development and 04css

[04]

CSS considerations

1. Page encoding specification 1.1. uniform use of UTF-8 encoding, with @ charset "UTF-8" specified page encoding. 1.2. Global font settings: windows 7: ariariariarial; windows XP and the following: New,, Arial MAC default font: Helvetica Neue and Helvetica Hiragino Sans GB. Font-family: "Microsoft Yahei", "Hiragino Sans GB", "Helvetica Neue", Helvetica, tahoma, arial, Verdana, sans-serif, "WenQuanYi Micro Hei ", "\ 5B8B \ 4F53"; 1.3. chinese fonts are converted using encoding. 1.4. Web security colors are recommended. 2. the attribute is written in one row. spaces should be reduced between attributes, between attribute names and values, and between attributes and "{}", and the last ";" should be removed, for example :. class {width: 200px; height: 100px} 3. attribute writing sequence: 3.1. the element model is written from the outside and the inside, from the whole to the details. It is roughly divided into five groups: position, left, right, float box model attributes: display, margin, padding, width, height border and background: border, background section and text: line-height, text-indent, font, color, text-decoration ,... other attributes: overflow, cursor, visibility ,... 3.2. for special browser attributes, they should be written before standard attributes, such as-webkit-box-shadow:;-moz-box-shadow:; box-shaow :; 4. Attributes With a prefix, one row at a time, and vertical alignment of the values of each attribute to facilitate editing and maintenance. 5. exercise caution when adding new selector rules. In particular, do not abuse id. Inherit and reuse existing styles as much as possible. 6. the selector, attribute, and value are all in lowercase (except for color values). The name of the abbreviation must indicate the full name before the abbreviation, for example. cl-> Clearfix 7. avoid using various CSS Hack. If you need to define IE. 8. Do not use redundant and inefficient CSS statements. For example, ul li a span {...} 9. Use it with caution! Important 10. We recommend that you use a semantic classname or id. 11. Avoid using filters with poor compatibility. 12. If the filter is not fixed during development, use [!]. Mark to facilitate subsequent discussions. 13. The format of the comment. Use the double slash plus *. 14. The spacing between upstream and downstream modules is implemented using the margin-top of the next module. The advantage is that there will be no more gaps without the next module. 15. Do not directly use hover, selected, disabled, current, and other resources that have specific meanings. 16.: link: visited: hover: active write order L-V-H-A, stenographer: LoVe (like) HAte (HAte ). 17. Do not use @ import