HTML5 is a brand-new markup language.
HTML5 many new tags are available, most of which are often used in our previous web design, but HTML5 to standardize it. So our design concept method is still unchanged, but will need to replace the label to replace it, of course , HTML5 also put forward a lot of new ideas, these things need us to study carefully, so we learn HTML5, in fact, is learning these new design concepts.
I'll look into it. HTML5
1, about the declaration
old version of HTML(HTML4.01,XHTML1.0) at the beginning of the declaration statement content is very rich, rich to I look at the point of trembling, too long, I can't remember, every time is the site copy. <! doctypehtml Public "-//w3c//dtd XHTML 1.0 strict//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >
HTML5 in the site of the declaration of a major reform, a short sentence <! DOCTYPE html> is doing everything, the streamlined statement makes the entire code look neat.
2. Document encoding
This document encoding also has the right to be streamlined, then only need to add a sentence between <meta charset= "Utf-8" > , also very simple.
Attached: Original document code: <meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/>
3. Semantic tags
One of HTML5 's most interesting aspects is her new semantic tags, which greatly regulate the meaning of the code.
first of all, I'll build a simple, standard HTML5 page code:
<!doctype html>
<meta charset= "Utf-8" >
<body>
<nav> navigation </nav>
<section>
<article> articles </article>
<aside> side bar </aside>
</section>
<footer> end </footer>
</body>
from the above code it is easy to see the difference between his previous code: many of the previous <div class= "" ><div id= "" > No, replaced by a more explicit semantic label, Powerful semantic tags can almost control the entire page, because they support nesting, a page has the beginning, the content, the end, the content, the end of the same can have their own beginning, content, end, but also can continue nesting, that is, almost every label opening and closing will form a closed space, The interior of this space can derive the perfect thing (that is, the semantic tag does not appear only once in a Web page, he can not only appear multiple times, but also in different space when they do not interfere with each other, she only for his space service).
Semantic tags
Serial number
|
Label
|
Significance
|
|
|
1
|
Nav
|
Defining navigation
|
|
|
2
|
Header
|
Defining the document Header
|
|
|
3
|
Section
|
Defining the document Area
|
|
|
4
|
Article
|
Fixed on sidebar
|
|
|
5
|
Aside
|
Define sidebar or related content
|
|
|
6
|
Footer
|
Define the end of a document page
|
|
|
|
|
|
|
|
This article is from "Owl" blog, please make sure to keep this source http://9096185.blog.51cto.com/9086185/1430525