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 | |
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!

Hot AI Tools

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Undress AI Tool
Undress images for free

Clothoff.io
AI clothes remover

Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Hot Tools

Notepad++7.3.1
Easy-to-use and free code editor

SublimeText3 Chinese version
Chinese version, very easy to use

Zend Studio 13.0.1
Powerful PHP integrated development environment

Dreamweaver CS6
Visual web development tools

SublimeText3 Mac version
God-level code editing software (SublimeText3)

Hot Topics

HTML is suitable for beginners because it is simple and easy to learn and can quickly see results. 1) The learning curve of HTML is smooth and easy to get started. 2) Just master the basic tags to start creating web pages. 3) High flexibility and can be used in combination with CSS and JavaScript. 4) Rich learning resources and modern tools support the learning process.

HTML defines the web structure, CSS is responsible for style and layout, and JavaScript gives dynamic interaction. The three perform their duties in web development and jointly build a colorful website.

WebdevelopmentreliesonHTML,CSS,andJavaScript:1)HTMLstructurescontent,2)CSSstylesit,and3)JavaScriptaddsinteractivity,formingthebasisofmodernwebexperiences.

AnexampleofastartingtaginHTMLis,whichbeginsaparagraph.StartingtagsareessentialinHTMLastheyinitiateelements,definetheirtypes,andarecrucialforstructuringwebpagesandconstructingtheDOM.

GiteePages static website deployment failed: 404 error troubleshooting and resolution when using Gitee...

The Y-axis position adaptive algorithm for web annotation function This article will explore how to implement annotation functions similar to Word documents, especially how to deal with the interval between annotations...

HTML, CSS and JavaScript are the three pillars of web development. 1. HTML defines the web page structure and uses tags such as, etc. 2. CSS controls the web page style, using selectors and attributes such as color, font-size, etc. 3. JavaScript realizes dynamic effects and interaction, through event monitoring and DOM operations.

To achieve the effect of scattering and enlarging the surrounding images after clicking on the image, many web designs need to achieve an interactive effect: click on a certain image to make the surrounding...
