HTML5 Structure Learning (3): html5 Structure Learning

Source: Internet
Author: User

HTML5 Structure Learning (3): html5 Structure Learning


We have learned the new principal structure elements and the new non-principal structure elements in HTML5. Here we will learn how to comprehensively use these new elements.

 

1. Outline

The key to the HMTL5 element is to closely associate the display content with the tag type, improving the code semantics and readability.

The outline here refers to the general layout of the entire website content. Can be dividedDisplay LayoutAndImplicit Layout.

1) typographical content Block

This means that the section and other elements are explicitly used to create the document structure, and each section has its own title (h1 ~ H6, hgroup)

2) Implicit typographical content Block

It means that you do not explicitly use section and other elements, but directly create your own content under each title.

3) Title Classification

In the same block, titles can be displayed in different levels.

Different title levels must be separated and displayed.

The section is displayed, which is automatically listed below implicitly.

4) different content blocks can use titles of the same level

For example, if the website title and the article title are different blocks, we can use h1

 

2. Use styles for new structural elements

Because of browser compatibility issues, we still need to tell the browser some basic attributes of these elements.

Append as a block-level element:

article, aside, section, dialog,figure,footer,header,legend,nav{    display:block;}

The style of adding html5 elements is the same as that of the previous elements.

The method for creating elements in js is the same:

document.createElement("header");document.createElement("article");document.createElement("footer");

 


How can I learn html5, css3, and JavaScript without basic learning ?? Thank you very much.

This depends on how much you want to learn. If you are serious about it, you can definitely make your own simple website within a month. Complicated... Especially js, which requires time to accumulate various knowledge points, at least in my experience

If you want to learn more, we recommend that you learn html4 and css2 well, because this is the mainstream of the current website. Currently, only mobile phones support html5 more. You want to popularize html5 on your computer, at least in China, it was still early, because html5 and IE should at least ie9, that is, the system should be at least win7. it is unrealistic in a short time.

Html and css are very simple. As long as they can speak a little English, they can learn very quickly. As for js, if we need to at least implement various forms of detection, it's also very easy. It takes a night to study and understand.

HTML5 learning steps can also be said to master the knowledge point in sequence. The more detailed the better

If you are a newbie:
1. Evolution of HTML;
2. General Structure of HTML;
3. HTML5 multimedia playback, Canvas, geographic positioning, local storage, and other knowledge under supported Branch Standards (involving deep javascript knowledge, especially Canvas );
4. Apart from javascript, CSS3 is also required;

5. Although HTML5 is a partnership between browser vendors and the W3C XHTML2.0 standard, the support of various browsers is still inconsistent, especially the IE, when learning about CSS3, you also need to have a deep understanding of the browser's support for the new attributes of CSS3, as well as the support for HTML5 at any time.

If you use HTML4.X or XHTML1.X, you can ignore the first two.

I don't know. Ask again! Have a good time!

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.