Shulou(Shulou.com)06/03 Report--

This article mainly shows you the "sample analysis of css naming rules", the content is easy to understand, clear, hope to help you solve your doubts, the following let the editor lead you to study and learn the "sample analysis of css naming rules" this article.

Head: header

Content: content/container

Tail: footer

Navigation: nav

Sidebar: sidebar

Column: column

Page periphery controls the overall layout width: wrapper

Left and right center: left right center

Login bar: loginbar

Logo: logo

Advertisement: banner

Page body: main

Hot spot: hot

News: news

Download: download

Subnavigation: subnav

Menu: menu

Submenu: submenu

Search: search

Link: friendlink

Footer: footer

Copyright: copyright

Scroll: scroll

Content: content

Tag page: tab

List of articles: list

Tip: msg

Tip: tips

Column title: title

Join: joinus

Guide: guild

Service: service

Registration: regsiter

Status: status

Voting: vote

Partner: partner

The way notes are written

/ * Footer * /

Content area

/ * End Footer * /

Naming of id

Container: container

Header: header

Content: content/container

Page body: main

Footer: footer

Navigation: nav

Sidebar: sidebar

Column: column

Page periphery controls the overall layout width: wrapper

Left and right center: left right center

Naming of id

Page structure

Container: container

Header: header

Content: content/container

Page body: main

Footer: footer

Navigation: nav

Sidebar: sidebar

Column: column

Page periphery controls the overall layout width: wrapper

Left and right center: left right center

Navigation

Navigation: nav

Main navigation: mainbav

Subnavigation: subnav

Top navigation: topnav

Edge navigation: sidebar

Left navigation: leftsidebar

Navigation on the right: rightsidebar

Menu: menu

Submenu: submenu

Title: title

Summary: summary

Function

Logo: logo

Advertisement: banner

Login: login

Login bar: loginbar

Registration: regsiter

Search: search

Ribbon: shop

Title: title

Join: joinus

Status: status

Button: btn

Scroll: scroll

Tag page: tab

List of articles: list

Tip: msg

Current: current

Tip: tips

Icon: icon

Note: note

Guide: guild

Service: service

Hot spot: hot

News: news

Download: download

Voting: vote

Partner: partner

Link: link

Copyright: copyright

Naming of class

(1) Color: use the name of the color or hexadecimal code, such as

.red {color: red;}

.f60 {color: # f60;}

.ff8600 {color: # ff8600;}

(2) Font size, use "font+ font size" as the name directly, such as

.font12px {font-size: 12px;}

.font9pt {font-size: 9pt;}

(3) align the style, using the English name of the alignment target, such as

.left {float:left;}

.bottom {float:bottom;}

(4) title block style, named in the way of "category + function", such as

.barnews {}

.barproduct {}

Matters needing attention

1. All lowercase

two。 Try to use English

3. No center bars and underscores.

4. Try not to abbreviate, except for words that are easy to understand.

Major master.css

Module module.css

Basic shared base.css

Layout layout.css

Topic themes.css

Column columns.css

Literal font.css

Form forms.css

Patch mend.css

Print print.css

The above is all the contents of the article "sample Analysis of css naming rules". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.