Home > Developer > Web Develop
7. Document elements
The main role of document elements is to divide the various content, so that the entire page layout is clear and crisp, so that the entire layout has semantics, and further replace the Div.
There is essentially no practical effect, and the main purpose is to differentiate between themes and concepts when the page is laid out.
H1~h6 for title
Header indicates title
Footer means tail
Nav represents a navigation element that is intended to be lumped together
section denotes an important concept or topic
Article says a separate piece of content is generally used in blog posts
Address represents the contact information for a document or article
Aside says there are few things involved with the surrounding content
Hgroup organize a group of headings together
Details to produce an area where users can expand it for more details
Summary is used in the details element to represent the title or description of the element's content
1 <!DOCTYPE HTML>2 <HTMLLang= "ZH-CN">3 <Head>4 <MetaCharSet= "Utf-8"5 <title>Document elements</title>6 </Head>7 <Body>8 <Header>9 <Hgroup>Ten <H1>This is the main title</H1> One <h4>It's a subtitle.</h4> A </Hgroup> - </Header> - <aside>This is the sidebar content</aside> the < Section> - <nav>This is the navigation.</nav> - <Details>Generate a region</Details> - + </ Section> - <article> + this is the opposite of the content A </article> at <Footer> - <h4>It's a subtitle.</h4> - <Address>This is the contact information.</Address> - </Footer> - </Body> - </HTML>View Code
8. Embedding elements
IMG Embedding Images
Property:
src Embedded image URL
Alt when the picture does not load the alternate content that is displayed
Width define picture widths (pixels)
Height defines picture heights (pixels)
Ismap creating a server-side partition response diagram
Usemap Associations <map> Elements
Map definition Client partition response diagram
Area represents the region of a user-side partition response graph
IFRAME embedded in an HTML document
Embed embed content flash in HTML with plugins
Meter graphical representation of embedded values in the background of a licensed value range between 10 and 100 min min is ten Max is not supported on IE
Progress graphical representation of embedded goal progression or task completion IE9 not supported below
Object embeds content in an HTML document HTML4 standard
param represents the parameters that will be passed to the plug-in through the object element
Audio represents a sound resource
Video represents a visual resource
Canvas to generate a dynamic graphical canvas
Source represents a Media resource
SVG represents structured-word vector content
Track indicates additional tracks for the media (such as subtitles)
1 <!DOCTYPE HTML>2 <HTMLLang= "ZH-CN">3 <Head>4 <MetaCharSet= "Utf-8">5 <title>Embedding elements</title>6 </Head>7 <Body>8 <ahref= "index8.html"><imgismap=""src= "Img.jpg"alt= "Picture"width= " the"Height= "443"Usemap= "#Map"></a>9 <Mapname= "Map">Ten < AreaShape= "Rect"coords= "31,28,112,100"href= "Http://www.baidu.com"Target= "_blank"alt= "Square"></ Area> One < AreaShape= "Circle"coords= "187,142,47"href= "http://www.ibm.com"Target= "_blank"alt= "Round"></ Area> A </Map> - <BR> - <ahref= "Http://www.haosou.com"Target= "in">Good search</a> the <BR> - <iframesrc= "Http://www.baidu.com"width= "The "Height= "+"name= "in"></iframe> - <BR> - <Embedsrc= "Http://images.cnblogs.com/cnblogs_com/chaowei119/23694/o_cwlogo.gif"></Embed> + <BR> - <Progressvalue= "+"Max= "+"></Progress> + <BR> A <Metervalue= "+"min= "Ten"Max= "+"></Meter> at </Body> - </HTMLView Code
HTML5 Study Notes 3
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
