How to format text in an HTML document.
<html>
<body>
<p><b>This text is bold</b></p>
<p><strong>This text is strong</strong></p>
<p><big>This text is big</big></p>
<p><em>This text is emphasized</em></p>
<p><i>This text is italic</i></p>
<p><small>This text is small</small></p>
<p>This is<sub> subscript</sub> and <sup>superscript</sup></p>
</body>
</html>
This text is bold
This text is strong
This text is big
This text is emphasized
This text is italic
This text is small
This is subscript and superscript
_____________________________________________
Preformatted text
How to control the line breaks and spaces with the pre tag.
<html>
<body>
<pre>
This is
preformatted text.
It preserves both spaces
and line breaks.
</pre>
<p>The pre tag is good for displaying computer code:</p>
<pre>
for i = 1 to 10
print i
next i
</pre>
</body>
</html>
This is preformatted text. It preserves both spaces and line breaks.The pre tag is good for displaying computer code:
for i = 1 to 10
print i
next i____________________________________________________
"Computer output" tags
How different "computer output" tags will be displayed.
<html>
<body>
<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>Note:</b> These tags are often used to display computer/programming code.</p>
</body>
</html>
Computer code Keyboard input
Teletype text
Sample text
Computer variable
Note: These tags are often used to display computer/programming code.
_________________________________________________
Address
How to define contact information for the author/owner of an HTML document.
<html>
<body>
<address>
Written by mywebsite.com<br />
<a href="mailto:us@example.org">Email us</a><br />
Address: Box 564, Disneyland<br />
Phone: +12 34 56 78
</address>
</body>
</html>
Written by mywebsite.com
Email us
Address: Box 564, Disneyland
Phone: +12 34 56 78
_________________________________________
Abbreviations and acronyms
How to handle abbreviations and acronyms.
<html>
<body>
<p>The <abbr title="World Health Organization">WHO</abbr> was founded in 1948.</p>
<p>Can I get this <acronym title="as soon as possible">ASAP</acronym>?</p>
<p>The title attribute is used to show the spelled-out version when holding the mouse pointer over the acronym or abbreviation.</p>
</body>
</html>
The WHO was founded in 1948.
Can I get this ASAP?
The title attribute is used to show the spelled-out version when holding the mouse pointer over the acronym or abbreviation.
________________________________
Text direction
How to change the text direction.
<html>
<body>
<p>
If your browser supports bi-directional override (bdo), the next line will be written from the right to the left (rtl):
</p>
<bdo dir="rtl">
Here is some Hebrew text
</bdo>
</body>
</html>
If your browser supports bi-directional override (bdo), the next line will be written from the right to the left (rtl):
Here is some Hebrew text
_________________________________________
Quotations
How to handle long and short quotations.
<html>
<body>
A long quotation:
<blockquote>
This is a long quotation. This is a long quotation. This is a long quotation. This is a long quotation. This is a long quotation.
</blockquote>
<p><b>Note:</b> The browser inserts white space before and after a blockquote element. It also insert margins.</p>
A short quotation:
<q>This is a short quotation</q>
<p><b>Notice that the browser inserts quotation marks around the short quotation (Does not work in IE).</b></p>
</body>
</html>
<body>
A long quotation:
<blockquote>
This is a long quotation. This is a long quotation. This is a long quotation. This is a long quotation. This is a long quotation.
</blockquote>
<p><b>Note:</b> The browser inserts white space before and after a blockquote element. It also insert margins.</p>
A short quotation:
<q>This is a short quotation</q>
<p><b>Notice that the browser inserts quotation marks around the short quotation (Does not work in IE).</b></p>
</body>
</html>
A long quotation:
This is a long quotation. This is a long quotation. This is a long quotation. This is a long quotation. This is a long quotation.Note: The browser inserts white space before and after a blockquote element. It also insert margins.
A short quotation:
This is a short quotation
Notice that the browser inserts quotation marks around the short quotation (Does not work in IE).
__________________________________________
Deleted and inserted text
How to mark deleted and inserted text.
<html>
<body>
<p>My favorite color is <del>blue</del> <ins>red</ins>!</p>
<p>Notice that browsers will strikethrough deleted text and underline inserted text.</p>
</body>
</html>
<body>
<p>My favorite color is <del>blue</del> <ins>red</ins>!</p>
<p>Notice that browsers will strikethrough deleted text and underline inserted text.</p>
</body>
</html>
My favorite color is
Notice that browsers will strikethrough deleted text and underline inserted text.
HTML Text Formatting Tags
| Tag | Description |
|---|---|
| <b> | Defines bold text |
| <big> | Defines big text |
| <em> | Defines emphasized text |
| <i> | Defines italic text |
| <small> | Defines small text |
| <strong> | Defines strong text |
| <sub> | Defines subscripted text |
| <sup> | Defines superscripted text |
| <ins> | Defines inserted text |
| <del> | Defines deleted text |
HTML "Computer Output" Tags
| Tag | Description |
|---|---|
| <code> | Defines computer code text |
| <kbd> | Defines keyboard text |
| <samp> | Defines sample computer code |
| <tt> | Defines teletype text |
| <var> | Defines a variable |
| <pre> | Defines preformatted text |
HTML Citations, Quotations, and Definition Tags
| Tag | Description |
|---|---|
| <abbr> | Defines an abbreviation |
| <acronym> | Defines an acronym |
| <address> | Defines contact information for the author/owner of a document |
| <bdo> | Defines the text direction |
| <blockquote> | Defines a long quotation |
| <q> | Defines a short quotation |
| <cite> | Defines a citation |
| <dfn> | Defines a definition term |
Posts
1 comment:
https://www.welookups.com/html/html_quotation_elements.html
Post a Comment