CSS-Naming conventions

CSS File classification

1. Common type: Label reset, default setting, Universal style

2, Special type: Special layout, special module, special skin

CSS File Reference order

1. Public

2. Main body

3, skin and other modules

Common file names

Master.css or INDEX.CSS or main.css the main

MODULE.CSS Module

BASE.CSS or GLOBAL.CSS Basic public

LAYOUT.CSS layout

Themes.css Themes

Skin.css Skin Change

COLUMN.CSS column

Font.css text, Font

Forms.css form

MEND.CSS Patch

PRINT.CSS Printing

CSS Internal Reference Order

1. Style reset and body style

2, unified background and font, functional style Clearfix

3. Layout (grid) (. g): Head, body, main bar, side bar, tail, etc.

4. Module (. m): Navigation, login, registration, list, comment, search

5. Component (Unit) (. u): button, input box, icon

6, function (. f): Special-purpose CSS, such as hidden elements

7. Skin (. s): text color, background, border

8. Status (. z): can only be combined with or as a descendant element

CSS Naming conventions

1. All names are lowercase and named in English

2. Color value and Character set capitalization

2, category naming, such as:. G

3, use abbreviations, such as: Nav, BTN

4, use class name, determine the unused style with ID name

5, use the semantics of the name, do not use a single letter named

6, use-or _ connection naming, such as: Header-banner, Header_banner

Common naming

Layout (. g)

Document Doc

Head Heads HD

Body BODY BD

Tail foot ft

Main column Main MN

Main column Container Maincontains MNC

Side Bar Side SD

Side bar Container Sidecontains SDC

Box Container Wrap WP

Module (. m), component (. u)

Navigation Navigator Nav

Sub-navigation Subnavigator Snav

Bread crumbs Crumb CRM

Menus Menu

Tabs tab

Title Area Head/title Hd/tt

Content Area Body/content bd/ct

Lists List

Tables Table TB

Form Form FM

Hot

Ranking Top

Log in to login

Logo logo

Advertising Banner

Searching for Search

Slide Slide

Tip Tips

Help

Press News

Download Download

Registration Register

Vote vote

Copyright

Results result

Titles Title

Pushbutton button BTN

Enter input IPT

function (. f)

Floating clear Clearfix CF

Float left Floatleft FL

float Right Floatright fr

Inline block-level Inlineblock IB

Text Center Textaligncenter TAC

Text Right Textalignright tar

Text left Textalignleft Tal

Center vertically Verticalalignmiddle VAM

Overflow Hidden Overflowhidden OH

Completely disappear Displaynone DN

Font size FontSize FS

Font weight fontweight FW

Skin (. s)

Font Color FontColor FC

Background background BG

Background color BackgroundColor BGC

Background picture backgroundimage BGI

Background positioning backgroundposition BGP

Border Color bordercolor BDC

Status (. z)

Select Selected Sel

Current CRT

Show Show

Hiding hide

Opening Open

Closing close

Error ERR Error

Not available for disabled dis

CSS-Naming conventions