HTML basic composition structure and tag recognition, html composition tag

HTML basic composition structure and tag recognition, html composition tag
Basic HTML structure and tags

In fact, the composition structure is illustrated in a diagram as follows:

At present, the general website structure is so unclear and simple.

Let's talk about the header.

This makes it clearer that the navigation bar is a quick portal to guide users to view the content of the website. For example, if you go to the supermarket to buy soy sauce, classification areas will appear on the top of the supermarket, for example, daily necessities, clothing, Kitchenware, etc.

Then you will find the category of the item you want to buy, and then you will only need to find the soy sauce you want to buy. Is this easy to understand?

Let's continue to look at the content section as the name suggests, which is a specific embodiment of the author's or the author's display of text and image content as follows:

This is the presentation of content. For example, we all know that Starbucks is the place of coffee. This is his hearder. However, it depends on the content of the coffee, you can go to the front desk to check the type and price of coffee.

I personally think the difference between hearder and content is that the header is an overview directory. Although content can also be implemented, more content can locate a specific attribute and address.

Finally, let's talk about footer's foot.

This is the contact information and supervision of the above list of websites. For example, it is the same as the license plate, that is, the supervision of the vehicle management department should also have your contact information.

Does it give a general impression on the webpage composition structure?

Next, let's talk about the html webpage tag.

There is a simple way to view the web page tag, that is, right-click the blank area of the web page to view the source code.

 

Is it possible to see a lot of code consisting of <> Angle brackets, This is the tag </> A slash is called the closure of the tag. It can also be understood as <Start> </end>

To see the corresponding relationship title, the general situation is as follows: Of course, there are other places to write the title usage, this is not considered for the moment

 

Let's take a look at the relationship of the content section as follows:

 

Of course, I will only give a brief introduction here.

We are looking at labels. <> internal and external relationships are also known as nesting.

<Div>

<H2>

<Ul>

<Li> </li>

<P> </p>

</Ul>

</H2>

</Div>

A layer of tags is the nesting of tags. The outermost div is the chairman of the board. h2 is the same level as the general manager. ul is also the general manager. li and p are department directors.

For example, you are the chairman of Company A and the chairman of Company B. At this time, you need to hand in A copy of the text you want to share with you about cooperation, then B will return to the company

Notify me of this, just like this: div> h2> ul> li or p. Then the employee can directly send the text to the boss if they know that the boss wants to write the text, our crawler BeautifulSoup also crawls based on this logic.

The desired content is to find the content at the tag level.

This is a brief introduction to the future.