Title: Title
Content: content/container
Tail: Footer
Navigation: navigation
Sidebar: Sidebar
Column: column
Page periphery controls overall layout width: packaging
Center left and right
Log in: log in
Logo: logo
Advertising: banners
Page body: main page
Hot spot: heat
News: news
Download: download
Sub-navigation: subnav
Menu: Menu
Submenu: submenu
Search: search
Friendship link: friendlink
Footer: Footer
copyright
Scroll: scroll
Content: content
Label: label
Article list: list
Prompt information: message
Hint: hint
Column headings: headings
Join: joinus
Guide: guild
Service: service
Registration: regsiter
State: state
Voting: Voting
Partner: Partner.
(2) Writing method of notes:
/* Footer */
Content area
/* End footer */
(3) naming of 3)id:
(1) page structure
Container: container
Title: Title
Content: content/container
Page body: main page
Footer: Footer
Navigation: navigation
Sidebar: Sidebar
Column: column
Page periphery controls overall layout width: packaging
Center left and right
(2) Navigation
Navigation: navigation
Main navigation: mainbav
Sub-navigation: subnav
Top navigation: top navigation
Side navigation: sidebar
Left navigation: left sidebar
Right navigation: right sidebar
Menu: Menu
Submenu: submenu
Title: Title
Summary
(3) Function
Logo: logo
Advertising: banners
Login: login
Log in: log in
Registration: regsiter
Search: search
Functional area: store
Title: Title
Join: joinus
State: state
Button: btn
Scroll: scroll
Label: label
Article list: list
Prompt information: message
Current: current
Hint: hint
Icon: Icon
Attention: attention
Guide: guild
Service: service
Hot spot: heat
News: news
Download: download
Voting: Voting
Partner: Partner.
Friendship link: link
copyright
(4) the naming of the class:
(1) color: use the name of the color or 16 hexadecimal code, such as
. Red {color: red; }
. f60 { color:# f60; }
. ff 8600 { color:# ff 8600; }
(2) font size, directly using "font+font size" as the name, such as
. font 12px { font-size: 12px; }
. font 9pt { font-size:9pt; }
(3) Alignment method, using the English name of the alignment target, such as
. left { float:left; }
. Bottom {float: bottom; }
(4) Title bar style, named by "category+function", for example
. barnews { }
. barproduct { }
note:
1. All cases are lowercase;
2. Try to use English;
3. Don't add middle bars and underscores;
Try not to abbreviate unless you can understand the words at first sight.
Master.css
Module module.css
Basic * * * use base.css
Layout.css
Theme themes.css
Column columns.css
Text font.css
Form forms.css
Patch patch. css
Print. css