List of common naming conventions for div css page design_html/css_WEB-ITnose

Any code programming has common naming conventions with its own characteristics, and div css page design is no exception. Complying with commonly used CSS naming conventions is conducive to code upgrades and expansions, and also helps others understand your CSS code, making your pages appear clear and organized.

CSS file name naming convention

Module: module.css Basic common: base.css Layout, layout: layout.css Theme: themes.css Column: columns.css Text: font.css Form: forms .css Patch: mend.css Print: print.css

Page structure element div naming convention

Header: header Content: content/container Tail: footer Navigation: nav Sidebar: sidebar Column: column Peripheral control of the overall layout of the page Width: wrapper Left right center: left right center Login bar: logo Footer: footer Copyright: copyright Scroll: scroll Content: content Tag page: 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

Color naming-use the color name or hexadecimal code

.red {color: red;} .f60 {color: #f60;} .ff8600 {color: #ff8600;}

Font size naming - directly use "font font size" as the name

.font12px {font-size: 12px;} .font9pt {font-size: 9pt;}

Alignment style naming - use the alignment target English name

.left {float:left;} .bottom {float:bottom;}

Title bar style naming - use the "category function" method to name

.barnews { } .barproduct { }

Comment writing specifications

1. Interline comments - written directly after the attribute value, such as:

.search{
border:1px solid #fff;/*Define search input box Border*/
background:url(../images/icon.gif) no-report #333;/*Define the background of the search box*/
}

2. Entire comment- Add comments at the beginning and end respectively, such as:

/*======Search bar=====*/
.search {
border:1px solid #fff;
background:url(../images/icon.gif) no-repeat #333;
}
/*=====End of search bar=====*/

The above are the commonly used naming conventions in div css page design that we have compiled. Everyone should gradually develop a good habit of standardized naming in daily page design.

Source: csscss.org