HTML5 text element parsing

1. represents keywords and product names

HTML5

Explanation: The actual function of the element is to make it bold. From a semantic point of view, it means marking a piece of text, but not particularly emphasizing its importance.

##2. Indicates important text

##HTML5

Explanation : The actual function of the element is the same as , which is to make it bold. From a semantic point of view, it means emphasizing an important text.

##3.
Force newlineSafe newline

Thisabc

dksdfsdf< ;wbr>sdfsf s a apple

Explanation: Typing
at any text position will be wrapped. When the English word is too long, using will be appropriate according to the appropriate width of the browser. Crop switch lines.

##4. Indicates foreign vocabulary or scientific and technological terms

HTML5

Explanation: The actual function of the element is to tilt. From a semantic point of view, it means to distinguish the surrounding content, which is not particularly emphasized or important.

#5, < ;em>To emphasize

HTML5

Explanation: The actual function of the element is the same as , which is to tilt: From a semantic point of view, Expresses emphasis on a piece of text.

##6. indicates inaccuracy or correction

HTML5

Explanation: < The actual function of the ;s> element is to strike through. From a semantic point of view, it means inaccurate deletion

##7. means deletion of text

HTML5 Element

Explanation: The actual function of the element is the same as , which is a strikethrough. From a semantic point of view, it means to delete text

8. means underlining the text

HTML5

Explanation:

##9. Add a piece of text

HTML5

Explanation: The element has the same function as . Adding an underline means adding a paragraph of text from a semantic point of view, which plays a role of emphasis.

10, HTML5

Explanation: The actual function of the element is to make the text one size smaller. From a semantic point of view, it is used Disclaimer, and clarification statement

##11, _{Add subscript^{Add superscript}}

_{5 sub>}

⁵

Explanation: The actual functions of the _{and ^{elements are subscripts and superscripts in mathematics}}

12. Indicates input and output

HTML5

HTML5> ;

HTML5

HTML5

Explanation: represents a computer code fragment, represents a variable in a coding language. <samp> represents the output of a program or computer: <kdb> represents the user's input. Since this is in the English category, lang='en' must be used to reflect the effect<p></p> <p></p> <p>13. <abbr> represents an abbreviation </abbr></p> <p></p> <abbr>HTML5</abbr><p></p>Explanation: The <abbr> element has no practical effect, from a semantic point of view It is the abbreviation of a piece of text <p><br></p> <p><br>14. <dfn> indicates the definition term</dfn></p> <p></p> <dfn>HTML5</dfn> <p> </p>Explanation: The <dfn> element is a general slant. From a semantic point of view, it means a piece of text that explains a word or phrase.<p><br></p> <p><br>##15. <q>Quoting content from elsewhere</q></p> <p> <q>HTML5</q> </p> <p>Explanation: The actual function of the <q> element is to add a pair of double quotes, from the semantics Seen above, it means quoting content from other parties. <br></q></p> <p><br></p> <p></p>##16. <cite>Citing titles of other works<p></p> <cite>HTML5</cite> <p></p>Explanation: The actual function of the <cite> element is to make it bold. From a semantic point of view, it indicates the title of citing other works <p><br></p> <p>##17, <ruby elements></ruby></p> <ruby><p></p> <p> 饕<rp>(</rp><rt>tao</rt>)</p> <p> 餮<rp>(</rp>&gt ;<rt>tie</rt>)</p> <p></p></ruby><p>Explanation: <ruby> is used for non-Western languages provide support. <rp><rt>It is used to help readers master the correct pronunciation of ideographic language characters, for example: </rt></rp></ruby></p> <p> Hanyu Pinyin is above the text, but Muqiao FireFox does not support <br></p> <p><br></p> <p>18. <bdo>Set text direction</bdo></p> <p><bdo dir="rt1">HTML5</bdo> </p> <p>Explanation: <bdo> You must use the attribute dir to set it. There are two values ​​in total, rtl from left to right, and ltr (from left to left). The general setting is ltr, and there is also a <bdi> element that also handles direction. Since it is a special effect in a special language and is not supported by mainstream browsers, ignore</bdi></bdo></p> <p><br></p> <p>19 and <mark>highlight text</mark></p> <p><mark></mark></p> <p>Explanation: The actual function of <mark> is to add a yellow background and black words. From a semantic point of view, it is context-related and prominent text. Used for notation </mark></p> <p><br></p> <p>20, <time> represents date and time<br></time></p> <p><time>207-2-12</time> <br></p> <p>Explanation: The <time> element has no practical effect and semantically represents date and time. </time></p> <p><br></p> <p>21, <span> represents General text<br></span></p> <p><span>HTML5</span></p> <p>Explanation: has no practical effect, semantically represents a piece of text, and is often used to set CSS and other operations</p> <p><br></p> <p><br></p> <p>Example: </p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:php;toolbar:false;'>&lt;!DOCTYPE html&gt; &lt;html lang=&amp;#39;en&amp;#39;&gt; &lt;head&gt; &lt;meta charset=&amp;#39;utf-8&amp;#39;&gt; &lt;title&gt;基本&lt;/title&gt; &lt;/head&gt; &lt;body&gt; b元素，这是&lt;b&gt;HTML5&lt;/b&gt;教程&lt;br&gt; strong元素，这是&lt;strong&gt;HTML5&lt;/strong&gt;教程&lt;br&gt; wbr元素，这里填充一下：Thisisaasdfsdddddddddddddddddd&lt;wbr&gt;dddddddf&lt;wbr&gt;asdfasd is apple&lt;br&gt; i元素，这是&lt;i&gt;HTML5&lt;/i&gt;教程&lt;br&gt; em元素，这是&lt;em&gt;HTML5&lt;/em&gt;教程&lt;br&gt; s元素，这是&lt;s&gt;HTML5&lt;/s&gt;教程&lt;br&gt; del元素，这是&lt;del&gt;HTML5&lt;/del&gt;教程&lt;br&gt; u元素，这是&lt;u&gt;HTML5&lt;/u&gt;教程&lt;br&gt; ins元素，这是&lt;ins&gt;HTML5&lt;/ins&gt;教程&lt;br&gt; small元素，这是&lt;small&gt;HTML5&lt;/small&gt;教程&lt;br&gt; sub元素，这是&lt;sub&gt;5&lt;/sub&gt;教程&lt;br&gt; sup元素，这是&lt;sup&gt;5&lt;/sup&gt;教程&lt;br&gt; code元素，这是&lt;code&gt;HTML5&lt;/code&gt;教程&lt;br&gt; var元素，这是&lt;var&gt;HTML5&lt;/var&gt;教程&lt;br&gt; samp元素，这是&lt;samp&gt;HTML5&lt;/samp&gt;教程&lt;br&gt; kdb元素，这是&lt;kdb&gt;HTML5&lt;/kdb&gt;教程&lt;br&gt; abbr元素，这是&lt;abbr&gt;HTML5&lt;/abbr&gt;教程&lt;br&gt; dfn元素，这是&lt;dfn&gt;HTML5&lt;/dfn&gt;教程&lt;br&gt; q元素，这是&lt;q&gt;HTML5&lt;/q&gt;教程&lt;br&gt; cite元素，这是&lt;cite&gt;HTML5&lt;/cite&gt;教程&lt;br&gt; ruby元素， &lt;ruby style=&quot;font-size: 50px;&quot;&gt; 饕&lt;rp&gt;(&lt;/rp&gt;&lt;rt&gt;tao&lt;/rt&gt;&lt;rp&gt;)&lt;/rp&gt;餮&lt;rp&gt;(&lt;/rp&gt;&lt;rt&gt;tie&lt;/rt&gt;&lt;rp&gt;)&lt;/rp&gt;&lt;/ruby&gt;&lt;br&gt; bdo元素，这是&lt;bdo dir=&amp;#39;rtl&amp;#39;&gt;HTML5&lt;/bdo&gt;教程&lt;br&gt; mark元素，这是&lt;mark&gt;HTML5&lt;/mark&gt;教程&lt;br&gt; time元素，这是&lt;time&gt;2017-2-12&lt;/time&gt;教程&lt;br&gt; span元素，这是&lt;span&gt;HTML5&lt;/span&gt;教程&lt;br&gt; &lt;/body&gt; &lt;/html&gt;</pre><div class="contentsignin">Copy after login</div></div><p><img src="/static/imghw/default1.png" data-src="https://img.php.cn//upload/image/923/270/519/1487058506806656.png" class="lazy" title="HTML5 text element parsing" alt="HTML5 text element parsing" style="max-width:90%" style="max-width:90%"></p> <p>For more articles related to HTML5 text element analysis, please pay attention to PHP Chinese net! </p></cite></cite></dfn></abbr></kdb></samp>