HTML text
Text in an HTML document can be manipulated in many ways such as changing the texts size, color, font type, and more.
This lesson focuses on:
- Heading tags
- Making text bold, italic, and/or underlined
- The <font> tag
Heading tags
Heading tags are used to denote text of different sizes. The lower the number in the tag, the bigger the text will be.
Heading tags:
<h1> - <h6> </h1> - </h6>
Example:
<h5>this text is small</h5> <h3>this text is bigger</h3> <h1>this text is the biggest</h1>
Output:
this text is small
this text is bigger
this text is the biggest
Making text bold, italic, and/or underlined
- <b> <i> <u>
The <b> tag makes text bold, the <i> tag makes text italic, and the <u> tag underlines text.
Example:
<b>here is some bold text</b> <br /> <i>here is some italic text</i> <br /> <u>here is some underlined text</u> <br /> <u><i><b> here is some bold, italic, and underlined text </b></i></u>
Output:
here is some italic text
here is some underlined text
here is some bold, italic, and underlined text
The <font> tag
The <font> tag is used to set text size, font type, and color. It takes three attributes - size, face, color.
-
size
This attribute is a numerical value specifying the size of the text.
-
face
This attribute specifies the font of the text. It could be any value which is the name of a font on the users computer including Times New Roman, Comic Sans MS, and Courier New.
-
color
This attribute specifies the color of the text.
Example:
<font face="Comic Sans MS" color="green" size="5"> The font of this text will be Comic Sans MS, it will be green, and a size of 5. </font>
Output:
NOTE: The <font> tag is deprecated in HTML 4.01
Examples
Bold, italic, and underlined text
This example demonstrates displaying text as bold, italic, or underlined.
Headings
This example demonstrates displaying text in different sizes using headings.
Exercises
Create a webpage that prints your name to the screen in green. [See solution]
Create a webpage that prints to the screen the numbers 1 - 10, each number being a different color. [See solution]
