CSS naming convention
1. File naming convention
Global style: global.css;
Frame layout: layout.css;
Font style: font.css;
Link style: link.css;
Print Style: print.css;
2. Common class/ID naming convention
Header: header
Content: content
Container: container
Footer: footer
Copyright: copyright
Navigation: menu
Main navigation: mainMenu
Sub-navigation: subMenu
Mark: logo
Slogan: banner
Title: title
Sidebar: sidebar
Icon: Icon
Note: note
Search: search
Button: btn
Login: login
Link: link
Information box: manage
…
Common classes should be named in common English as much as possible The words shall prevail, make it easy to understand, and annotate where appropriate. For secondary class/ID naming, the combined writing mode is adopted, and the first letter of the last word should be capitalized: such as "search box" should be named "searchInput", "search icon" should be named "searchIcon", "search button" ” named “searchBtn” and so on.
CSS writing specifications and methods
1. Conventional writing specifications and methods
1. Select DOCTYPE:
XHTML 1.0 provides three DTD declaration options Options:
Transitional: A DTD with very loose requirements, which allows you to continue to use the HTML4.01 logo (but must comply with the xhtml writing method). The complete code is as follows:
XML/HTML code
Strict: For strict DTD, you cannot use any presentation layer identifiers and attributes, such as
. The complete code is as follows:
XML/HTML code
Frameset: A DTD designed specifically for frame page design. If your page contains a frame, you need to use this DTD. The complete code is as follows:
XML/HTML code
The ideal situation is of course a strict DTD, but for most of us designers who are new to web standards, a transitional DTD (XHTML 1.0 Transitional) is currently the ideal choice (including this site, which also uses transitional DTD). Because this DTD also allows us to use presentation layer identifiers, elements and attributes, it is also easier to pass W3C code verification.
For DTD, you can refer to:
http://www.chinaz.com/Design/Pages/0Z515A12007.html
2. Specify language and character set:
Specify language for document:
XML/HTML code
In order to be correctly interpreted by browsers and pass W3C code verification, all XHTML documents must declare the encoding language they use; such as:
Commonly used language definitions:
XML/HTML code
Standard XML document language definition:
XML/HTML code
Language definition for older browsers ：
XML/HTML code
To improve the character set, It is recommended to use "utf-8".
3. Call the style sheet:
Call the external style sheet:
Page inline method: write the style sheet directly in the head area of the page code. For example:
XML/HTML code
