Free HTML Training - Formatting Text in HTML

Microsoft Office Training > HTML/CSS Training > Free Computer Training > Formatting Text in HTML

Formatting Text in HTML

For bold use <b> </b> or preferably <strong> </strong>
For italic use <i> </i> or preferably <em> </em>

To apply both:
<b><i>Bold and Italic text</i></b>
Make sure you close the tags in the opposite manner that you opened them.
To use these tags in a list nest them inside the <li> </li> tag

The CSS alternative for bold and italic:

• For bold the font-weight rule can be used, the settings of which include bold, bolder and lighter. Normal is the default.
• For italic the font-style rule can be used, the settings of which include italic or oblique.  Normal is the default.

These rules can be used in the <p> and <li> tags.
<p style= “font-weight:bolder; font-style:italic”>
when multiple rules are applied they are separated by a semi-colon

 Other HTML tags for formatting text
<tt> - changes the typeface to a monospaced font (letters and spaces are the same width).  The default is Courier New, but can be changed in the Internet Options on a browser.

<pre> - causes exact spacing and line breaks to be preserved.  The typeface is also monospaced.

<big> - causes big text

<small> - causes small text

<sup> - causes superscript text

<sub> - causes subscript text

CSS Rules for formatting text
font-family      sets the font  (normally alternative fonts are given)
font-size          sets the font size
color                sets the font colour

<p style= “font-family:arial, sans-serif, ‘times new roman’; font-size:18pt; color:green”>
separate alternative fonts with a comma, font names with space enclose in single quotes. Hexadecimals can be used for colours

If you have set the formatting for a paragraph or division, but then want to change the format for part of it – a word or sentence, use the <span> </span> tag.  Specify the rule in the tag as you would within the <p> tag.
<span style= “font-family:arial, sans-serif, ‘times roman’; font-size:18pt; color:green”> The text</span>

NB as font name spellings can vary the only totally reliable fonts are:Times New Roman, Arial (PCs), Helvitica (Macs)