DIV CSS specification named collection_html/css_WEB-ITnose

When we develop CSS DIV web pages (Xhtml), the most confusing and tangled thing is CSS naming, especially newbies who don’t know how to name places and what is the best way to name them.

Description of naming rules:

1), all names should be lowercase

2), attribute values ​​must be in double quotes ( ""), and must have a value such as class="divcss5", id="divcss5"

3). Each tag must have a beginning and an end, and must have the correct level and layout. Regular and neat

4), empty elements must have an ending tag or add "/" after the beginning tag

5), performance and structure are completely separated, and no code is involved The expression elements, such as style, font, bgColor, border, etc.

6), definitions should follow the principle from large to small to reflect the structure of the document and facilitate search engine queries.

7), add a unique structure tag id to each table and form

8), add alt tags to images

9), try to use English naming principles

10) Try not to abbreviate words unless they are words that can be understood at a glance

CSS style naming for important parts of the outer layer of the web page:

Coat wrap------------------used for the outermost head header----------------used for the main head Content main------------used for main content (middle) left main-left-------------left layout right main- right--- --------Right layout navigation bar nav-----------------Web page menu navigation bar contentcontent------------- --For footer at the bottom of the middle body of the web page-----------------Used at the bottom

DIV CSS naming reference table:

The following is a reference table for CSS style naming and CSS file naming, DIV CSS naming collection:

CSS style naming	Description
Web page public name
#wrapper	Page periphery controls the overall layout width
#container or #content	Container, used for the outermost
#layout	Layout
#head,#header	Header part
#foot,#footer	Footer section
#nav	Main navigation
#subnav	Secondary navigation
#menu	Menu
#submenu	Submenu
#sideBar	SideBar
#sidebar_a,#sidebar_b	Left or right sidebar
#main	Page body
#tag	tag
#msg#message	Prompt message
#tips	Tips
#vote	Vote
#friendlink	Friendly connection
#title	title
#summary	Summary
#loginbar	Login bar
#searchInput	Search input box
#hot	Hot Hotspot
#search	Search
#search_output	Search output is similar to search results
#searchBar	Search Bar
#search_results	Search results
#copyright	Copyright Information
#branding	Trademark
#logo	Website LOGO
#siteinfo	Site Info
#siteinfoLegal	Legal Statement
#siteinfoCredits	Credit
#joinus	Join us
#partner	Partner
#service	Service
#regsiter	Register
arr/arrow	Arrows
#guild	Guidelines
#sitemap	sitemap
#list	list
#homepage	Homepage
# subpage	Secondary page subpage
#tool,#toolbar	Toolbar
#drop	dropdown
#dorpmenu	dropdown menu
#status	status
#scroll	scroll
.tab	tab
.left.right.center	Left, center, right
.news	News
.download	Download
.banner	Advertising banner (top advertising banner)
Electronic trade related
.products	products
.products_prices	Product Prices
.products_description	Product Description
. products_review	product review
.editor_review	Edit comments
.news_release	Latest Product
.publisher	Manufacturer
.screenshot	Thumbnail
.faqs	FAQ
.keyword	Keyword
.blog	blog
.forum	Forum
CSS file naming	Description
master.css,style.css	main
module.css	Module
base.css	Basic sharing
layout.css	Layout, layout
themes.css	Theme
columns.css	columns
font .css	Text, font
forms.css	Form
mend.css	patch
print.css	Print

Huidu provides [genuine IDE joint promotion plan], various IDEs are sold as low as half price (deadline 2014/12/31). In addition, there are 50% off limited-time sales and free iPhone 6, iPad air and other gifts!