Front-End Tutorials (5) HTML tags and document structure

Source: Internet
Author: User
Tags tag name

An HTML tag and document structure

HTML as a markup language, is a variety of tags to mark the content of the Web page. We learn HTML is mainly to learn HTML tags.

So what is a label?

# 1, in the HTML stipulation label uses the English angle brackets namely ' < ' and ' > ' to wrap up, such as '  # 2. The tags in the HTML are usually paired, divided into the start and end tags, the end tag is more than the start tag a '/', the start tag and the end tag between the contents of the label.  #3, some of the label function is relatively simple, using a label, this label is called the closed and label, such as:<br/> 

tags in html are stored in a text file and are organized according to the following fixed document structure:

<! DOCTYPE html>

Parts of the HTML document structure are explained

# 1, <! DOCTYPE Html> is a document declaration that must be written in the first line of the HTML document, before the  #2,  #3,  #4, the content between <body> and </body> tags is the main content of the page, will eventually appear in the browser. 

Relationship between HTML tags

# 1. Parallel (brother/Peer)     head and Body#2, nested (parent/subordinate)    HTML has body inside
Two HTML tags detailed syntax and attention points

Syntax for Tags:

< Tag Name property 1 = "Value 1" Property 2 = "Value 2" ......> content section </label name >< Label Name Property 1 = "Value 1" Property 2 = "Value 2" ....../>


# 1. HTML tags are not case-sensitive, '  #2. Tags can be nested between them. For example:<div><p> paragraph </p></div>, but not cross <div><p></div></p># 
Tag classification in three HTML

Single from the angle of whether you can embed a sub-label, the label is divided into two categories

# 1, Container class label The     container class tag can be easily understood as a label that can nest all other labels.    Common Container-level tags:     H-Series     ul>li    ol>li    dl>dt+dd    Div # 2. Text class label    Text-level labels correspond to container-level labels, and only text/Picture/hyperlink tags can be nested .    Common text-level tags:    p    span    strong    em    ins    del
Four HTML annotations

No matter what programming language we learn, it is important to note that annotations, which I personally have always regarded as the mother of code. The format of comments in HTML:

<!--here is the content of the note--

Note: You can use carriage return to wrap directly in comments.

And we're used to wrapping up the HTML code with the annotated tag. Such as:

<!--xx Part start     -up here put your XX part of the HTML code <!--XX part End--

Considerations for HTML Annotations:

# 1. HTML annotations do not support nesting.  #2, HTML annotations cannot be written in HTML tags. 

Front-End Tutorials (5) HTML tags and document structure

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: 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.