Deep understanding of HTML5 Series-text labels

Source: Internet
Author: User

Ext.: http://blog.csdn.net/lihui130135/article/details/45150501

About:       about HTML5 I believe we have known each other long ago, but what role does his real meaning have in concrete development? With respect to HTML, what new definition and new ideas does he have in it? Why do some experts think that when HTML5 is completely complete, all the work can be achieved in a true cloud way? Do you have any idea about this series of questions?       This series of articles will answer all the things you don't know about HTML5 and HTML, including: HTML5 new ideas and ideas, the purpose of HTML5 new tags and the application of specific development scenarios, HTML5 and CSS3 's emotional experience (collocation), including HTML5 's father HTML some small privacy (what you may not know in development);  everyone good, and meet with you,  today I will talk to you about what you may not know? Let's take a look at 1. What is the importance of the element title attribute to semantics? 2) What are the new tags in HTML5 that have important implications for writing text? 3) Correct usage and precautions of <address>, <figure>, <time> tags in HTML5 what do you not know? 4) about <em><strong> and <b ><i> 's past life?   First question element what is the importance of the title attribute to semantics?      title Properties Does this just look at the title tag? But don't get together, they are completely different things; we seldom use this property in our development, first of all it is what it is, in fact, he is a prompt effect of the property; For screen readers, you can read text to the user , so the correct use can improve the accessibility of the page, such as the effect in the browser and Code;  code implementation   effect display   friends have not found this has the feeling of déjà vu, is the previous use of tags, The alt attribute of the feeling, this is to need to be noticed by friends, in IE7 before the IMG tag is alt to display the text, but after the IE7 version, if the ALT and title of the two properties appear in the Title property is displayed in the text instead of the ALT attribute ; If the result of the run:    the second question, what are the new tags in HTML5 that have important implications for writing text?        I would like to say a few words before writing the answer to the question of the understanding and usage of these tags (at least the small part is so understanding and self-feeling effect can also);    1, clear the core idea of HTML5 is semantics, So no matter what the label is to see the meaning of the expression, rather than to see the effect of the;    2, the relevant text about the label can be properly imagined as a Chinese punctuation mark so that can be easily remembered and used (or you can also through other means)     All right, two points above, we're talking about the semantics and usage of these new tags.;     <address> <figure> <time> These three tabs the next question is, in a few words, let's not talk about it. ;    <strong><em> This two tag is already in the HTML4.0, but here's a little bit of it because it might have been used very infrequently because few people notice the semantics;    < Strong> represents important text (the default is bold)-the emphasis is on semantic expression rather than on the effect of the presentation. This needs to be remembered.;    <em> represents the underlined text (default italic)     The new element in the     <mark> tag HTML5 is used to highlight the text, and its effect is to be labeled as a highlighter-focused statement;     <span> Tag this is also in the HTML has already had, the previous article also probably mentioned but no detailed explanation, Here is a detailed explanation: 1.span does not have any semantics, so the correct way to use it is to be used when there is no other appropriate label to use it; 2. It is a phrase-level label so it does not appear on a new line, 3. You can add a span tag as a div to increase semantics by using a micro-format; 4. General circumstances You need to use CSS to control its display style because it has no style;      <wbr> a new label that looks like <br>, except that it doesn't force a line break;      <ruby><rp><rt> These labels are like phonetic transcription in Chinese.The same;      <meter> can use it to do some measurement results display and poll results display (now the problem is that the browser does not support it)        <progress> the same progress bar display, can be used for some good interaction with the user effect; The problem is that browser compatibility is now not good;  the third problem HTML5 <address>, <figure >, <time> the correct usage and precautions of tags what you don't know?       <address> This tag is new so it's very rare to use his people as for the correct usage of course, few people study it; a simple summary:  1.address is used to define the contact information of the author, person, or organization associated with the HTML page or part of the page, Usually located at the bottom of the page or in the relevant section;  2. Most of the time, the contact information is the author's e-mail or link to the contact information page; This is correct, cannot mark the "Contact Us" in the office location This is the wrong use;  3. To provide accurate information, Not to say that the address of the e-mail is correct, but that you need to provide information on the person, if a page has a lot of relevant people, then provide information when you must determine the accuracy of information, do not pigtailed;  4.address tag cannot have h1~h6\article\ Address\aside\footer\header\hgroup\nav\section and other tags;        <figure> This element is used to introduce charts, graphs, Photos, and so on, the corresponding scene is like a magazine picture, before the HTML5 is not a special label to do this, before the implementation of this function is to use the non-semantic div tag;    usage tips:    1. A figure element can contain more than one content block, but only one figcaption (which can be interpreted as a caption) label      2. You can use H1~h6 to add headings;    3 to figures. Figcaption cannot appear alone, need to have matching content together;    &NBSP;&NBSP;&NBSp;<time> can mark a specific time or date with this tag; The application scenario is usually the time of the publication of an article, such as:  It is important to note that the time in 1.datetime is preferably the same as the date of the text element in the Times tab, and the notation can be different; 2. If this time is to represent the entire article or the time of the page need to add the pubdate attribute; 3. Do not use the time tag for an exact period such as: " Today noon "," last weekend "4. If you use the Pubdate property, you need to be aware that you want to avoid pigtailed problems under the same parent tag; The 5.times label cannot be nested in another time label; the time format in 6.datatime needs to be a standard machine for possible times such as: yyyy-mm-ddthh:mm:ss  actually as a new label it's used a lot, small part here just said some of the most basic things, but I think the use of the above so said things this time element can be said to be a primer    Fourth question           about <em><strong> and <b><i> 's past life?    all of you who have developed HTML know that <em> is the same as <i>, <strong> and <b> their presentation, one is italic, one is bold, So how do they get along in the HTML5? Let's focus on the <b><i> 's previous life:    in the early days, the Internet at that time did not have a thing called CSS when the appearance, in order to distinguish between the text of the emphasis and special meaning of the text <b><i > The brothers appeared; with their help, the text of the page and the user's interaction was improved.     However, in the case of the rapid development of the Internet, soon appeared a CSS, its responsibility is to control the form of the page, of course, including the form of <b><i> performance, So in html4.0 and XHTML1, there are developers suggest abandoned <b><i&gt, and take the face of the <strong><em>+css, because they have the semantics to better interact with the user But the problem did not end there, because in some cases it was found in the development of &LT;STRONG&GT;&LT;EM&Gt; it's not always good. Semantic;    To this end, in the HTML5 <b><i> has a modified appearance to us, so in HTML5 and re-enabled <b><i> the brothers;     So, when did you use it in HTML5?     B tags indicate a piece of text that is intended to alert the reader for practical purposes, does not convey any additional importance, and does not represent other meanings and tones used for: keywords, product names, operation instructions, etc.;    I tag represents a piece of text different from other text, Having a different voice or tone for: classification name, technical terminology, idiomatic words in a foreign language, etc.;

In-depth understanding of HTML5 series-text labels

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.