Commonly used CSS naming rules_html/css_WEB-ITnose

Head: header

Content: content/container

Tail: footer

Navigation: nav

Sidebar: sidebar

Column: column

Page peripheral control overall layout width: wrapper

Left and 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

Sub-menu: submenu

Search: search

Friendly link: friendlink

Footer: footer

Copyright: copyright

Scroll: scroll

Content: content

Tab: tab

Article list: list

Prompt message: msg

Tips: tips

Column title: title

Join: joinus

Guide: guild

Service: service

Registration: 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 and 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

Advertising: banner

Login: login

Login bar: loginbar

Registration: regsiter

Search: search

Ribbon: shop

Title: title

Join: joinus

Status: status

Button: btn

Scroll: scroll

Tab: 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 link: link

Copyright: copyright

(4) 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) 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 { }

Notes::

1. Always lowercase;

2. Use English as much as possible;

3. Do not add dashes and underlines;

4. Try not to abbreviate unless it is clear at a glance Word.

Main master.css

Module module.css

Basic common base.css

Layout, layout layout.css

Themes themes.css

Columns columns.css

Text font.css

Forms forms.css

Patch mend.css

　Print print.css