HTML text formatting

HTML can define many elements for formatting output, such as bold and italics.

Here are some common examples:

①Text formatting: Format text in an HTML file

<b>This text is bold</b><br />
<strong>This text is strong</strong><br />
<big>This text is big</big><br />
<em>This text is emphasized</em><br />
<i>This text is italic</i><br />
<small>This text is small</small><br />
This text contains
<sub>subscript</sub><br />
This text contains
<sup>superscript</sup>

 ②Pre-formatted text: Use the pre tag to control blank lines and spaces

<pre>
This is
Preformatted text.
it preserves spaces
and newlines.
</pre>
The <p>pre tag is great for displaying computer code:</p>
<pre>
for i = 1 to 10
     print i
next i
</pre>

 ③ "Computer Output" tab: the display effect of different "Computer Output" tabs

<code>Computer code</code><br />
<kbd>Keyboard input</kbd><br />
<tt>Teletype text</tt><br />
<samp>Sample text</samp><br />
<var>Computer variable</var><br />
<p>
<b>Comments:</b> These tags are often used to display computer/programming code.
</p>

 ④Address: Write the address in the HTML file

<address>
Written by <a href="mailto:[email protected]">Donald Duck</a>.<br>
Visit us at:<br>
Example.com<br>
Box 564, Disneyland<br>
USA
</address>

 ⑤ Abbreviations and acronyms: Implement abbreviations or acronyms

<abbr title="etcetera">etc.</abbr><br />
<acronym title="World Wide Web">WWW</acronym>
<p>In some browsers, title can be used to display the full version of an expression when you hover over an acronym. </p>
<p>Only valid for the acronym element in IE 5. </p>
<p>Valid for both abbr and acronym elements in Netscape 6.2. </p>

 ⑥Text direction: change the direction of the text

    The bdo element can override the default text direction: the dir attribute has two optional values ​​ltr left; rtl right

<p>
If your browser supports bi-directional override (bdo), the next line will output right to left (rtl);
</p>
<bdo dir="ltr">Here is some Hebrew text text to the left</bdo>
<bdo dir="rtl">Here is some Hebrew text text to the right</bdo>

 ⑦Block quotes: Implement quotes of different lengths, long quotes <blockquote> and short quotes <q>

Here is the long quote:
<blockquote>
This is a long quote. This is a long quote. This is a long quote. This is a long quote. This is a long quote. This is a long quote.
This is a long quote. This is a long quote. This is a long quote.
</blockquote>
Here is the short quote:
<q>This is a short quote. </q>
<p>With the blockquote element, the browser inserts line breaks and margins, while the q element does not have any special rendering. </p>

 ⑧Delete word effect and insert word effect: mark delete text <del> and insert text <inr>

<p>Original price<del>3000</del> Current price<ins>6000</ins>yuan</p>
<p>Most browsers will rewrite to remove text and underline text. </p>
<p>Some older browsers will display deleted and underlined text as normal text. </p>

   【Text formatting tags】 Tag description

<b>	Define bold text.
<big>	Define large characters.
<em>	Define emphasis text.
<i>	Define italics.
<small>	Define small characters.
<strong>	Define accent.
<sub>	Define subscripts.
<sup>	Define superscript.
<ins>	Define the insertion word.
<del>	Define the delete word.
<s>	Deprecated. Use <del> instead.
<strike>	Deprecated. Use <del> instead.
<u>	Deprecated. Use style instead.

  【“Computer output” label】 Label description

<code>	Define computer code.
<kbd>	Define the keyboard code.
<samp>	Define computer code samples.
<tt>	Define the typewriter code.
<var>	Define variables.
<pre>	Defines preformatted text.
<listing>	Deprecated. Use <pre> instead.
<plaintext>	Deprecated. Use <pre> instead.
<xmp>	Deprecated. Use <pre> instead.

  【Citations, references and definitions of terms】 Label description

<abbr>	Define abbreviations.
<acronym>	Define the acronym.
<address>	Define the address.
<bdo>	Defines the text direction.
<blockquote>	Define long references.
<q>	Define short quotes.
<cite>	Define references, citations.
<dfn>	Define a definition item.

      .