css| Reference Program code
Header: Header
Content: Content/container
Tail: Footer
Navigation: Nav
Sidebar: Sidebar
Column: Column
Page perimeter control overall layout width: Wrapper
Left Right Center
Name all use lowercase letters, if you need more than one word, use "-" to separate words, such as user-list
Common code structure:
Program Code div: mainly for layout, split the structure of the page
Ul/ol: For unordered/ordered lists
Span: There is no special meaning that can be used as a support for typesetting, for example
<li><span> (4.23) </span> The six anniversary of the Magic net six anniversary of the Magic network six years of Magic network six </li>
Then define span as right float in CSS, and realize the effect of date and caption display on both sides
H1-h6: Title
H1-h6 Descending according to importance
The most important title of the H1 bit
Program code label: Good things to make your form more approachable and to assist with form typesetting, such as:
<label for= "User-password" > Password </label>
<input type= "password" name= "password" id= "User-password"/>
Fildset & Legend:fildset are set outside the form, and legend is used to describe the contents of the form. For example:
<form>
<fildset>
<legend>title</legend>
<label for= "User-password" > Password </label>
<input type= "password" name= "password" id= "User-password"/>
</fieldset>
</form>
Program code DL,DT,DD: When the first action appears in the page similar to the title/brief, then the following is a detailed description of the content should use the label, for example
<dl>
<dt> What is css?</dt>
<dd>css is a technique called style sheet (stylesheet). Some people call it cascading style sheets (cascading Stylesheet). <dd>
<dt> What is XHTML? </dt>
< dd>xhtml is an xml-based markup language that seems to be somewhat imagined with HTML, with only a few small but important differences. As you can see, XHTML is an XML that acts like an HTML role. XHTML is essentially a bridging (transition) technology that combines the power of XML (in some cases) with the simple features of HTML (most). </dd>
</dl>
Program code C #content
S #subcol
M #maincol
X #xcol
This is the vertical layout of the XHTML structure, c-smx that the Web page has three columns, C-SM said there are two columns, C-MX indicates that two columns one is attached, c-m represents a vertical bar.
The layout of the three columns needs to be divided into two layers: the first layer is #subcol and #main the second layer is the #maincol and #xcol in #main.
Program code custom naming:
According to the Web site, it's best to name it by meaning
For example: is important news highlighting (like red)
There are two kinds of
. red{color:red}
. important-news{color:red}
It's clear that the second message is more explicit, so try not to use it as your own custom name.
