1. Use div for layout, do not be wrapped within a span meaningless line with the common element div
2 may be used in the case of p and div, as far as possible the default font bold vertical spacing with like pp, the terminal can be adapted
3. It should be emphasized text can be included in the strong or em tag (the browser default style, use css would not specify them),
strong default style is bold (do not use b), em italic (no i)
4. When using the table,
the title Caption use
,
the table thead head, the body
portion with
tbody
surrounded
tail tfoot
surrounded by and separated from the header area to cells generally,
header with th, td cell with
5.
Forms
to use
fieldset labels hold up,
and with the
legend label
illustrate the use of the form
( technique too old not recommended )
<dl></dl><dd></dd>
<Cl> columns with rank numbers </ cl>
<Ol> for the dots preceding </ ol>
<ul></ul>
6. Each input tag corresponding to the explanatory text label require the use of labels (Click enable text input box acquired focus), and. Is provided in the label for = someld tag by setting the id attribute to make the input and the corresponding text description input associates.
7. Write as little html, be sure to write less
(Advantage: 1 dom reduce rendering time 2 waste file size.)
// The following code can replace a 3 div div a use
::after,::before
With display: inline-block (to replace a div)
content: "Entering Text"
height: 300px // set the height of the block
position:absolute
top:-10px
// The following is a semantic label
nav tag
header label
article label (label text)
Label section (block)
footer tag
aside tag
// the following page layout to this form, the reptile easy to work
<header>
<nav></nav>
</header>
<div class=:content>
<section>1喽</section>
<section>2喽</section>
<aside>边栏</aside>
Address <address> (no more useful) </ address>
</div>
<footer>
</footer>