Hypertext Markup Language-Html,

Source: Internet
Author: User
Tags control label

Hypertext Markup Language-Html,

High-end and luxurious pages are composed of static pages and some dynamic effects, inserted videos, and flash pages, it is the only way to learn web pages. It can be seen that static Web pages are very important to learn the front-end of web pages. Static web pages are mainly made through html. In simple terms, html is a hypertext markup language, and static Web pages are also represented by html tags and tag attributes to open your favorite Web browser, in the browser address input box, enter the relevant URL to enter the site of Active Server Pages (your computer should have been connected to the Internet ). After the webpage is displayed on the screen, select the View Source command from the menu bar of the Web browser. In this case, a new window is displayed and some strange text is displayed. The text you see is an HTML file.

In this blog post, I will explain the knowledge of HTML. First, I will use a mind map to summarize and review the previous knowledge. Then, I will give you several examples, let's take a look at how Html interprets her life story on her stage. First, let's look at the figure:

The HTML Tag consists of the start tag and end tag. The start tag is the name of the element surrounded by parentheses, and the end tag is the slash and element name surrounded by parentheses. Some HTML elements do not have end tags, the following figure shows an intuitive view;

Next, let's take a simple example to see how our elements and labels practice in practice. Let's take the poem Jin Se as an example to give a try:

Write the following code:

<Span style = "font-size: 18px;"> 

The display effect is as follows:

From the above display, we can see that the layout of this poem is messy, and we write six lines. Why are the three lines displayed? Here, I would like to remind you to pay attention to one problem. In the HTML document, if there are multiple consecutive blank characters (spaces, tabs, carriage returns, line breaks, etc ), the browser parses the display as a space character. In the preceding example, the carriage return space in the body element is basically ignored by the browser, so in the browser window, we can see the above display effect. If we want this poem to be displayed in a certain format, we need to control the section label, the following section uses the section control label to design the code of "Jin Se" as follows:

<Html> The display effect is as follows:

What we can see above is the page display effect after applying the mark related to paragraph control. Now I will use a diagram to explain in detail how each paragraph is used in this diagram:

Next, we will use the label related to text display to use this poem. The Code is as follows:

<Html> The results are as follows:

What we can see above is the page display effect after marking related to text display. The details are as follows:

In html documents, characters such as uninterruptible spaces and carriage return characters are reserved in html (for example, '<', indicating the start of a tag ), some special characters that do not exist on the keyboard, such as the copyright symbol, must be referenced before they can be entered. in html, there are two types of reference, character reference and object reference, both the character reference and the Object Reference start with "&" and end with a semicolon (;). If the character reference is used (&) add a pound sign (#), followed by the decimal code or hexadecimal code of the required characters. If the entity reference is used, write the character mnemonic after the Ampersand, next, we will use uninterrupted spaces to show the author Li Shangyin to the right at the bottom of Jin Se. The Code is as follows:

<Html> The effect is as follows:

An uninterrupted entity contains six characters, so one character occupies one byte. html itself is a text document, so an English character occupies one byte, the input of ten uninterruptible entity spaces occupies 60 bytes. Why is the result displayed by Li Bai right at the bottom of the meditation window, we have added 60 additional bytes. Do we use fewer bytes to achieve the same effect. We can implement it by using spaces with full spaces. The Code is as follows:

  

<Html> The effect is as follows:

   

It can be seen that the effect is the same. A full-width Space occupies two bytes. The function of a full-width space is similar to that of two non-stop spaces. A full-width Space occupies two bytes, an uninterrupted object contains six bytes. The full-width space can reduce the number of bytes of the document. At the same time, the document format is clear. However, full-width spaces do not support garbled characters in Chinese browsers. Therefore, consider whether the target users are Chinese users.

Editor's message: At the beginning, I started to get familiar with the relevant knowledge of html. I don't have a thorough understanding of it. If I have different understandings, I would like to discuss them, in this blog post, I made a simple summary of the content explained by Sun Xin, and then I made an example, hoping to leave a beautiful footprint on the road of xiaobian learning.

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.