Div + CSS naming convention 1. Form
Header: header
Content: content/container
End: footer
Navigation: nav
Sidebar: sidebar
Column: column
Overall Layout width of the page peripheral control: wrapper
Left right center
Logon entry: loginbar
Logo: logo
Advertisement: banner
Page subject: main
Hotspot: hot
News: news
Download: download
Subnavigation: subnav
Menu: menu
Sub menu: submenu
Search: search
Link: friendlink
Footer: footer
Copyright: copyright
Scroll: scroll
Content: content
Tab: tab
Article list: list
Message: msg
Tips: tips
Topic title: title
Join: joinus
Guide: guild
Service: service
Registration: regsiter
Status: status
Vote: vote
Partner: partner
Ii. css comments
/* Footer */content area/* End Footer */
Html annotation Syntax: <! -- Header -->
Iii. id name
1. Page Structure
Container: container
Header: header
Content: content/container
Page subject: main
Footer: footer
Navigation: nav
Sidebar: sidebar
Column: column
Overall Layout width of the page peripheral control: wrapper
Left right center
2. Navigation
Navigation: nav
Main navigation: mainnav
Subnavigation: subnav
Top navigation: topnav
Side navigation: sidebar
Left Navigation: leftsidebar
Right navigation: rightsidebar
Menu: menu
Sub menu: submenu
Title: title
Abstract: summary
3. Functions
Logo: logo
Advertisement: banner
Login: login
Logon entry: loginbar
Registration: regsiter
Search: search
Functional Area: shop
Title: title
Join: joinus
Status: status
Button: btn
Scroll: scroll
Tab: tab
Article list: list
Message: msg
Current: current
Tips: tips
Icon: icon
Note: note
Guide: guild
Service: service
Hotspot: hot
News: news
Download: download
Vote: vote
Partner: partner
Link
Copyright: copyright
Iv. class naming
1.Color
Use the color name or hexadecimal code, such as. red {color: red ;};. f60 {color: # f60 ;};. ff8600 {color: # ff8600 ;}
2. font size
Directly use 'font + font size' as the name, such as. font12px {font-size: 12px ;};. font9pt {font-size: 9pt ;}
3. Align the style
Use the English name of the alignment target, such as. left {float: left ;};. bottom {float: bottom ;}
4. Title bar style
Use the 'category + function' method, such as. barnews {};. barproduct {}
1. All are in lower case;
2. Try to use English;
3. Do not add hyphens or underscores;
4. Try not to be abbreviated. Except for words that can be understood without looking at them, the main ones are:
Parent Forum: master.css
Module: module.css
Basic sharing: base.css
Layout, layout: layout.css
Themes.css
Column: columns.css
Text: font.css
Form: forms.css
Patch: mend.css
Print: print.css
Thanks ~~