Reading notes: "HTML5 Development Handbook"-Changes in existing elements

Source: Internet
Author: User

Continue to learn HTML5 semantic content, the main introduction today, HTML5 before the elements of the HTML5 specification after the semantics and some examples of use.

First, cite

HTML5 has made great changes to the definition of the cite element, and in HTML4, the cite element allows the developer to display the author or speaker of the referenced content.

However, cite in HTML5 is used to display the title of a work (book, poem). The HTML5 specification also emphasizes that the person's name is not part of the title of the work. Therefore, you can use the following code:

<p>one of my Favarite books is <cite>the day of the     jackal</cite> by     <b>frederick Forsyth </b></p>

The HTML5 specification recommends using the B element to display the author name.

Cite the default style is italic.

The following are additional content:

So far, we have three tags that say "citation": blockquote cite Well, there may be q some confusion in the use of the process, in fact, there is a big difference between the three.

    • <blockquote>A tag definition is a block reference that is excerpted from another source:
<cite> Magnolia Decree </cite><blockquote>    <pre>        Life if only as the beginning of the beginning, what        autumn sad painting fan? It        is easy to change but the heart of the heart, but the people        change.        Lishan language to strike half a night,        tears 0 Bell finally do not complain. How        Thin Fortunately Viceroy Lang, wing to the same        day wish.    </pre></blockquote>

It is important to note that <blockquote> there is also a cite parameter that represents the source of the reference, which is not confused with the label.

    • <q>Tags are small references that do not require a paragraph, such as just a quote:
<cite>勃朗宁</cite>曾经说过:<q>只要朝着一个方向努力,一切都会变得得心应手。</q>

Similarly, the <q> label has a cite property that represents the URL of the reference source.

Second, OL

In HTML5, OL is redefined with 3 attributes attached:

    • start--How much the sequence number starts
    • reversed--Reverse numbering display
    • type--Type of numbering
1. Use the reversed property to display the list or in reverse order.
<!--normal order-->

2. Use the Start property to change the starting position of the numbering
<ol start= >    <li> starting from tenth </li></ol>

Third, DL

In HTML4, the DL element defines the table, but because of its unclear definition and use, this leads to a lot of misuse, and in HTML5, the DL element is redefined as a description or association list.

<dl>   <dt> Computers </dt>   <dd> instruments for calculation ... ...</dd>   <dt> display </dt>   <dd> devices for visually displaying information ... ...</dd></dl>

As the example above, we define a description list, dt define a key, dd define a value.

You can also assign multiple values to a key:

The DL element was previously used as a conversation content, but it is inappropriate to use a DL from a specification point of view. Initially there was a dialog element in the HTML5, but it was removed from the specification at the end of 2009 and can now be used with the P and span elements.

Iv. Small

In HTML4, small is used to narrow the font, but narrowing the font is a display-level problem that should be done by CSS. Therefore, in HTML5, the small element represents a small print body, such as copyright information, terms, or legal information.

<p><small>this site is licensed under S...</small></p>

Small is an inline element, and you can embed small into other elements, such as strong, to emphasize the importance of this small print.

V, B and strong

In HTML4, the B element is used as bold. Now it's purely for display. So you should use it to add styles to content that doesn't have special importance.

The means of blogging often use bold methods to behave differently.

<p><b> Blog means content ...</b></p>

The reason why strong is not applicable here is that we do not want to show that the means are more important, just to make his style different.

The strong element is used to identify important content. So it is not only used for bold writing, but also to express the importance of the content.

<p><strong> don't discuss problems with him! </strong> He will only oppose you </p>

VI, I and EM

The I element in HTML4 represents the creation of italic text, and the HTML5 specification gives some examples of use, such as a dream, a technical term, an idea, or a ship name:

<p> yesterday I didn't go fishing <i> (because I had to do laundry) </i></p>

Instead, the EM element represents an emphasis that can change the meaning of a sentence. One or more words contained in EM are emphasized in the sentence. If you move the EM element, that is, the emphasis on the content changes, the corresponding sentence also has a change in meaning.

<!--emphasize "Today"--><p> I <em> today </em> very happy </p><!--stressed "very happy"--><p> I am very happy today <em> </em></p>

Seven, abbr

ABBR is integrated with acronym in HTML5, and now abbr can either identify abbreviations or acronyms, and use the Title property to display the full name.

<P><ABBR title= "hypertext Markup Language" ><HTML></abbr> is the best since sliced web<p>

In HTML5, acronym was removed, using abbr overrides.

Eight, HR

HR is used to add a horizontal line to a document, and its usage is slightly changed. Now, use it at the end of the paragraph, such as in a book, to indicate the transition of the scene. Now the HR element is not common, because you can use CSS to add spaces, pictures, paragraphs, or other decorations behind any p, Div, article, section element.

Ix. deleted elements
      • Acronym (using ABBR)
      • Applets (using object)
      • Basefont (using CSS)
      • Big (using CSS)
      • Center (using CSS)
      • FRAME (iframe still exists)
      • Frameset
      • Noframes
      • Font (use CSS to display)
      • Strike (use S or del, depending on the content)
      • TT (using CSS)
      • U (using CSS)

Reading notes: "HTML5 Development Handbook"-Changes in existing elements

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.