Core content of HTML5

• Why developers can safely use HTML5

  • Compatibility. HTML5 in the old version of the browser can run normally, while supporting the HTML5 of the new browser will also be able to run HTML4, the site created with HTML4 is not necessary to rebuild all.

  • Practicability. HTML5 is able to solve real-world problems, HTML5 internally encapsulates only useful functions, and does not encapsulate complex and meaningless functions.

  • Non-revolutionary development. HTML5 internal functions are not revolutionary, but developmental. Because of compatibility, so non-revolutionary, will not overturn the previous standards. Because of its practicality, it has a developmental significance.

• HTML5 want to solve the problem

  • The compatibility between Web browsers is very low. HTML5 detailed analysis of the features of each Web browser, which is then based on the requirement that all internal functions of these browsers conform to a common standard.

  • The document structure is ambiguous. Add a lot of structural elements to make the document structure clearer and more semantic.

  • The functionality of the Web application has been limited. Provides a new API for a variety of Web applications, typically including multimedia playback, making it possible to implement rich Web applications.

• HTML5 New structure elements

  • Section,article,aside,header,hgroup,footer,nav,figure.

• Additional elements to add

  • Video,audio,embed,mark,progress,time,ruby,rt,rp,wbr,canvas,command (indicates command button), Details,datalist,datagrid,keygen, Output,source,menu.

• The type of the new INPUT element

  • Email,url,number,range, as well as multiple date pickers, including date,month,week,time,datetime,datetime-local

• Elements of abolition

  • Elements that can be replaced with CSS

  • No longer use frame frame, frame,frameset,noframes.

  • Only partially supported elements of the browser, Applet,bgsound, etc.

  • Other, RB elements are replaced by Ruby, etc.

• Global Properties

  • Contenteditable,designmode,hidden,spellcheck,tabindex

• Main structure Elements
  • Article

    • Independent, complete, externally referenced content

    • For example, a blog post, a forum post, a user comment, a standalone plugin

  • section

    • blocks the content on the page, or fragments the article, the contents of the section element can be saved to the database or exported to a Word document.

    • use taboo

      • do not use the section element as a set style page container, that is the work of the DIV element

      • do not use section for content chunks without headings

      • If article, aside, NAV elements are more eligible, do not use section

  • nav

    • navigation link Group

    • common occasions

      • traditional navigation bar

        /li>

      • sidebar navigation

      • page navigation

      • page action

    • differs from menu

      • menu is used on a series of command-issuing menus, primarily in Web applications

      /li>

  • Aside

    • Subsidiary information

  • Time and Micro format

    • Micro-format, is a method of using the class attribute of HTML to add additional information to the page, additional information such as time, phone, mailbox and so on.

    • Before HTML5, the use of the micro-format process, found that the time of the machine coding some problems, so HTML5 added the timing element to solve the problem.

    • The Pubdate property, which can be applied to the time element, represents the entire page or the published date of the article.

  • Non-principal structural elements

  • Header

    • This is usually the title of the entire page or content block, with a guide and navigation function.

  • Footer

    • Footnote to page or content partition

  • Hgroup

    • The element that groups the title and its sub-headings

  • Address

    • Used to render contact information in the document.

References: The authoritative guide for HTML5 and CSS3

Core content of HTML5