Home > Developer > Web Develop
There seems to be no shortcut to learning the front end.
Objective of this article: (well-known)
1. Create a basic HTML5 document structure
2. Use new semantic elements to layout pages
Directly below the code:
<!DOCTYPE HTML> <!--DOCTYPE simple statement, forcing modern browsers to use standard mode -<HTMLLang= "en"> <!--Specify the document language using Lang -<Head> <MetaCharSet= "UTF-8"> <!--Use the CharSet property to define the character encoding, where a 8-bit Unicode encoding is used - <title>HTML5 Markup-semantics</title> <Linkrel= "stylesheet"href= "Style.css"> <!--use the link element to introduce a CSS style sheet. The browser assumes that the link element has a text/css MIME type by default - <Scriptsrc= "App.js"></Script> <!--using the script element to introduce JavaScript scripts, the browser assumes that the script element has a text/javascript MIME type, unless you are using a JavaScript script -</Head><Body> <Header> <!--use header elements for headings and other important details (title, permalink, meta information), reusable elements - <Hgroup> <!--both the Hgroup and article elements can contain a h1. The title structure operates in a different way from the HTML4 - <H1>My Site</H1> <H2>My Title</H2> </Hgroup> <nav> <!--Use the NAV element to display the main navigation area or content directory - <ul></ul> </nav> </Header> <nav> <H1>Links headings</H1> <ul></ul> </nav> <aside> <!--Use the aside element to define a part of a page that is independent of the content area. such as the sidebar of an article, pop-up ads, or floating windows - <!--Other Info - </aside> < Section> <!--use the section element to define chunks of content, such as article areas or important forms. Chunks can have their own titles, navigation, and Scripts - <article> <!--use the article element to mark separate, unpublished content. - <Header> <H1>Post Tilte</H1> <Divclass= "Meta">Published by someone on< Timedatetime= "2015-07-17t12:30+00:00"> <!--use the time element to display the times in the specified format -12:30pm @</ Time> </Div> </Header> < Section> <!--Post - <P>This is a<Mark>Wonderful</Mark> <!--highlight the text section using the search terms in the Mark's highlighted document -article. </P> </ Section> </article> </ Section> <Footer> <!--use the footer element to represent the footer at the bottom of a page or area, usually including related articles and links, copyrights, and metadata - <ul><!--links -</ul> <!--Copyright - </Footer></Body></HTML>
The
The use of new semantic elements instead of the original <div class= "" In the form of the layout, not only to increase the readability of the page code, standardize the writing, easier search engine and assistive technology on the page understanding
But there are some problems, HTML5 new features for the old version of the browser can not be normal access and dynamic page can not be normal display and other issues, how to better solve it? The next HTM5 article will introduce an example
HTML5 document structure and new semantic elements
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
