(1) Commonly used CSS naming rules
Header: header
Content: content/container
Tail: footer
Navigation:nav
Sidebar: sidebar
Column: column
Page peripheral control overall layout width: wrapper
left right center: left right center
Login bar: loginbar
Logo: logo
Advertisement: banner
Page body: main
Hotspot: hot
News: news
Download: download
Sub-navigation: subnav
Menu: menu
Submenu: submenu
Search: search
Friendly link: friendlink
Footer: footer
Copyright: copyright
scroll:scroll
Content: content
Tag page: tab
Article list: list
Prompt message: msg
Tips: tips
Column title: title
Join: joinus
Guide: guild
Service: service
Register:regsiter
Status: status
Vote:vote
Partner: partner
(2) How to write comments:
/* Footer */
content area
/* End Footer */
(3) Naming of id:
(1)Page structure
container: container
Header: header
Content: content/container
Page body: main
Footer: footer
Navigation:nav
Sidebar: sidebar
Column: column
Page peripheral control overall layout width: wrapper
left right center: left right center
(2)Navigation
Navigation: nav
Main navigation: mainbav
Sub-navigation: subnav
Top navigation: topnav
Side navigation: sidebar
Left navigation: leftsidebar
Right navigation: rightsidebar
Menu: menu
Submenu: submenu
title: title
summary: summary
(3)Function
Logo: logo
Advertisement: banner
Login: login
Login bar: loginbar
Register:regsiter
Search: search
Ribbon: shop
Title: title
Join: joinus
Status: status
Button: btn
scroll:scroll
Tag page: tab
Article list: list
Prompt message: msg
current: current
Tips: tips
icon: icon
Note: note
Guide: guild
Service: service
Hotspot: hot
News: news
Download: download
Vote:vote
Partner: partner
Friendly links: link
Copyright: copyright
(4) Class naming:
(1) Color: Use the name or hexadecimal code of the color, 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) Alignment style, use the English name of the alignment target, such as
.left { float:left; }
.bottom { float:bottom; }
(4) Title bar style, named using "category + function", such as
.barnews { }
.barproduct { }
Note::
1. Always lowercase;
2. Use English as much as possible;
3. Do not add dashes and underlines;
4. Try not to abbreviate words unless they are words that are easy to understand at a glance.
mainmaster.css
modulemodule.css
Basic shared base.css
Layout, layout layout.css
themes themes.css
columnscolumns.css
textfont.css
formsforms.css
patchmend.css
printprint.css
The author please contact this site and include your name promptly. Contact email: edu#chinaz.com (change # to @).