Web page HTML Tutorial: Introducing the use of span and div tags

Source: Internet
Author: User
Tags html tags
Tutorials | Web page Since the purpose of the HTML beginner tutorial is simply to teach the skeleton elements of HTML, this intermediate tutorial adds some flesh and blood, which should not be particularly difficult, but can further enhance our understanding of HTML so that we can do more useful things.

HTML is just a means to content, and most HTML tags have meaning (tag p creates paragraphs, H1 tags to create headings, and so on), while span and div tags don't seem to have any content meaning, and sound like a bubble-made hammer as useless. But in fact, when combined with CSS, they are used very widely.

They are used to combine a chunk of HTML code and give a certain amount of information, most of which are associated with the class attribute class and the identity attribute ID with the element, and see the class and ID selector for the CSS Intermediate Guide.

The difference between span and div is that span is inline, used in a small chunk of inline html, and the DIV (think what division mean) element is block-level (in short, it is equivalent to a line break) that combines a chunk of code.

<div id= "Scissors" >
<p>this is <span class= "paper" >crazy</span></p>
</div>
In practice, Div, especially span, should not be abused, although there are other conflicting views. For example, you might want to emphasize the word "crazy" and The Bold class "paper", which may be used in this code:

<div id= "Scissors" >
<p>this is <strong class= "paper" >crazy</strong></p>
</div>
This is better than adding a span.

There is no clue for class class and identity ID? Don't worry, you'll be exposed to them in the CSS Intermediate Guide. All you have to remember is that span and div are "meaningless" tags. But there is a new saying that they are semantically. We are no longer in depth here.

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.