#InboxUpgrade2020

Page 3

TEXT FORMATING

Headings help in defining the hierarchy and the structure of the web page.

HTML Headings

                

HTML uses six levels of heading tags <h1> to <h6>; the higher the heading level number, the greater it's importance — so <h1> defines the most important heading, whereas the <h6> defines the least important heading in the document.
    <h1>This is a heading 1</h1>
    <h2>This is a heading 2</h2>
    <h3>This is a heading 3</h3>
    <h4>This is a heading 4</h4>
    <h5>This is a heading 5</h5>
    <h6>This is a heading 6</h6>

Each time you place a heading tag, your web browser built-in style sheets automatically create some empty space before and after each heading. Use CSS margin property to override browser's default style sheet. 

HTML Paragraphs

                

Paragraphs are defined with the <p> tag. Paragraph tag is very basic and typically the first tag you will need to publish your text on the web pages.

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>

HTML Comments

                

Comments are usually added with the purpose of making the source code easier to understand. It may help other developer (or you in the future when you edit the source code) to understand what you were trying to do with the HTML. Comments are significant to programmers but typically ignored by browsers.

       

An HTML comment begins with <!--, and ends with -->, See the example below:

<!-- This is an HTML comment -->
    <h1>This is a heading</h1>
    <p>This is a paragraph.</p>

HTML Spaces

                

Normally the browser will display the multiple spaces created inside the HTML code by pressing the space-bar key on the keyboard as one space, while multiple line breaks created through pressing the enter key also displayed as single space. Insert   for creating extra spaces, and <br> tag to create line breaks inside your HTML document.

<p>multiple&nbsp;&nbsp;&nbsp;spaces.</p>
    <p>multiple<br><br>line<br><br><br>breaks.</p>

HTML Formatting Tags

            

There are several tags exist in HTML to format text, like <b>, <i> etc. These formatting tags can make text bold, italic, sub/superscripted, and more.

<p><b>This text is bold</b></p>

    <p><code>This is computer code</code></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><mark>This text is marked</mark></p>

    <p><strong>This text is strongly emphasized</strong></p>

    <p>This is _subscript and ^superscript</p>

    <p><ins>This text is inserted to the document</ins></p>

    <p><del>This text is deleted from the document</del></p>

The <strong> tag normally renders as <b>, and <em> renders as <i>. However, there is a difference in the meaning of these tags.

                                                                                                        

Note: The <strong> and <em> tags are "logical" tags. Use these tags when the content of your page requires that certain words or phrases be stressed, and if you want highlighting words only for visual effect, use the <b> and <i> tags.

HTML Text Formatting Tags                                                                                                                                                                                                                                          

Tag	Description
<b>	Defines bold text.
<del>	Defines deleted text.
<em>	Defines emphasized text.
<i>	Defines italic text.
<ins>	Defines inserted text.
<mark>	Defines marked/highlighted text.
<small>	Defines small text.
<strong>	Defines strong text.
<sub>	Defines subscripted text.
<sup>	Defines superscripted text.

                        

---

            

HTML Citations, Quotations, and Definition Tags

                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            

Tag	Description
<abbr>	Defines an abbreviation.
<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.

                        

---

            

HTML Computer Output Tags

                                                                                                                                                                                                                                                                                                                                                                                                                                                    

Tag	Description
<code>	Defines computer code text.
<kbd>	Defines keyboard text.
<samp>	Defines sample computer code.
<var>	Defines a variable.
<pre>	Defines preformatted text.