hgroup

SectionThe section element depicts a document or a common sections in a program, in general, a part that contains a head and a content block. A section can be represented as a bar, or a tab box block in the tab page. A page can be split into multiple sections, representing introduction, news items, and contact information, respectively.If the content of an element is set together to display the corresponding meaning, it can be defined as a article element without the need to use a section elemen

appears: Above the table.syntax:4.HTML5 Semantic Tags1): Article tag: Load displays a separate article content.For example, a full forum post, a website news, a blog article, and so on, a user comments and so on artilce can be nested, the inner layer of the artilce external layer of the article tag has a subordinate relationship.For example, a blog post can be displayed in article, and some comments can be embedded in article form.2): section tab: Defines the sections in the document. such as c

, details, figcaption, figure, Footer, Header, Hgroup, menu, nav, section {display:block; }/* set Image video and other adaptive adjustments */img {max-width:100%; height:auto; width:auto9;/* IE8 */}.video embed,. Video object,. Video Ifra me {width:100%; height:auto;}With the above three steps, a basic mobile phone webapp framework is built.But what's the downside? That's to let the phone support touch events! Here I recommend a JS plugin, hammer.js.

A, ABBR, acronym, address, applet, article, aside, audio, B, big, blockquote, body, canvas, caption, center, cite, code, D D, Del, details, DFN, Div, DL, DT, EM, embed, fieldset, figcaption, figure, Footer, form, H1, H2, H3, H4, H5, H6, header, Hgroup, HTML, I, IFRAME, IMG, INS, KBD, label, legend, Li, Mark, menu, nav, object, OL, output, p, pre, Q, Ruby, S, Samp, section, small, span, strike, strong, sub, summary, SUP, table, TBODY, TD, TFOOT, TH, TH

, footer, Header, Hgroup, menu, nav, output, Ruby, section, Summary,time, mark, audio, video {margin:0;padding:0;Border:0;font-size:100%;Font:Inherit;vertical-align:Baseline;}/*HTML5 display-role reset for older browsers*/article, aside, details, figcaption, figure, Footer, Header, Hgroup, menu, nav, section{Display:Block;}Body{Line-height:1;}OL, UL{List-style:None;}blockquote, Q{Quotes:None;}Blockquote:bef

articles;The aricle usually contains header elements, footer elements;The title HN of article is usually written in the header element;Article can be nested, but the inner and outer layers of the article content to be related;Section divides paragraphs into headings that do not need to be written in the header tag;Section and article can be nested use;Section and article are used to divide the area, not to replace the DIV as a container to set the page style, if necessary, to makeSet with Div;I

browser different settings caused by the impact.It is recommended that you create a reset style sheet for Eric Meyer, which is not recommended to be completely copied and added according to your project needs.Note: When using HTML5, it is important to set display:block for new elements to avoid bugs that do not support new elements./*http://meyerweb.com/eric/tools/css/reset/v2.0 | 20110126 license:none (public domain)*/html, body, Div, span, applet, object, IFRAME,H1, H2, H3, H4, H5, H6, p, blo

; Timedatetime= "2015-07-12 09:28:04"pubdate= "pubdate">2 hours ago Time> P> Header> P>general-like pullP> article> Section> Footer> Small>Reference footer!! ~Small> Footer>Body>HTML>SectionDefinition and usagesectionNot just an ordinary container label. It should be used when a tag is just for styling or for scripting purposes div . In general, when the element content is explicitly present in the document outline,

, details, figcaption, figure, footer, head Er, hgroup, menu, nav, section, Summary,time, mark, audio, video {margin:0; padding:0; border:0; outline:0; font-size:100%; Vertical-align:baseline; Background:transparent;} body {line-height:1;} article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block;} Nav ul {list-style:none;} BLOCKQUOTE, q {quotes:none;}

MetaCharSet= "Utf-8"5 >Document elementstitle>6 Head>7 Body>8 Header>9 Hgroup>Ten H1>This is the main titleH1> One h4>It's a subtitle.h4> A Hgroup> - Header> - aside>This is the sidebar contentaside> the Section> - nav>This is the navigation.nav> - Details>Generate a regionDetails> - + Section> - article> + this is the opposite of the content A article> at Footer> -

suitable label for containers.The definition of these semantic tags, it is not possible to fully meet our design goals, like the enactment of the law can not be circulated for 100 years, not to mention it is not long ago, it is impossible to these semantic tags on the design goals of adaptation. Just to a certain extent the "general", our goal is to let the crawler understand important things is enough.Conclusion: The div cannot be discarded because of the HTML5 tag, and every thing has its uni

define a style for them:The Code is as follows:Header, footer, article, section, nav, menu, hgroup {Display: block;}However, IE still cannot parse the newly added HTML5 tags. At this time, Javascript is needed to solve this problem:The Code is as follows:Document. createElement ("article ");Document. createElement ("footer ");Document. createElement ("header ");Document. createElement ("hgroup ");Document.

support this function. before using this function, you can check whether window. localStorage exists.10. semantic headers and footer11. More HTML5 Form Features12. IE and HTML5By default, new HTML5 elements are rendered in inline mode, but you can use the following method to makeIt is rendered in block mode.Header, footer, article, section, nav, menu, hgroup {Display: block;}Unfortunately, IE ignores these styles and can fix them like the following:D

Section labelArticle labelNav LabelThe Nav tag represents a part of the page, a group of links that can be navigated as a page, where navigation elements are linked to other pages or other parts of the current page, making the HTML code more accurate in semantics and better for devices such as screen readers.Aside labelAside tags are used to load non-body content and are treated as a separate part of the page. It contains content that is separate from the main content of the page and can be dele

/*reset*/Body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote, th,td,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{margin:0;padding:0;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{Display:block;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,b,i,th,var,optgroup{Font-style:normal

Article--ExplanationArticle label loading displays a separate article content. For example, a full forum post, a website news, a blog article, and so on, a user comments and so on artilce can be nested, the inner layer of the artilce external layer of the article tag has a subordinate relationship. For example, a blog post can be displayed in article, and some comments can be embedded in article form.--Show listThis is an articleSection--ExplanationThe section tag defines the sections in the doc

, DT, DD, OL, UL, Li,8 fieldset, form, label, legend,9 table, Caption, Tbody, TFOOT, THEAD, tr, TH, TD,Ten article, aside, canvas, details, figcaption, figure, One footer, Header, Hgroup, menu, nav, section, summary, A Time , mark, audio, video{ - margin:0; - padding:0; the Border:0; - Outline:0; - font-size:100%; - vertical-align:Baseline; + background:Transparent; -} + A Body{ at Line-height:1; -} - - : Focus{ - Outline:1; -} in - Article,aside,c

, but you can use the following method to makeIt is rendered in block modeHeader, footer, article, section, Nav, menu, Hgroup {Display:block;}Unfortunately, IE ignores these styles and can fix them like this:Document.createelement ("article");Document.createelement ("footer");Document.createelement ("header");Document.createelement ("Hgroup");Document.createelement ("Nav");Document.createelement ("menu");Hg

a.createdocumentfragment ();c = C | | N (a);var d = C.frag.clonenode (), E = 0,f = m (), g = f.length;for (; e}function Q (A, b) {B.cache | | (B.createelem = {}, B.createelem = a.createelement, B.createfrag = A.createdocumentfragment,B.frag = B.createfrag ()),A.createelement = function (c) {return s.shivmethods? o (c,a,b): B.createelem (c)},A.createdocumentfragment = Function ("H,f", "return Function () {var n=f.clonenode ()" +"c=n.createelement;h.shivmethods (" +m (). Join (). Replace (/[\w\-]