CSS gives you great control over the way your text is displayed. You can change the text size, color, style, and how to make text bold or underlined, resize your font using percentages.Let us begin the lesson applying one by one.
The example specifies color below :
Example:
h4 { color: red; }
h5 { color: #9000A1; }
h6 { color: rgb(0, 220, 98); }
Output:
This is a red h4 header.
This is a hexadecimal #9000A1 h5 header.
This is an rgb(0, 220, 98) h6 header.
CSS Font Family
The font family of a text is set with the font-family property. The font-family property should hold several font names as a "fallback" system. If the browser does not support the first font, it tries the next font.
Example:
h4 { font-family: arial,sans-serif; }
h5{font-family:"Times New Roman", Times, serif;}
Output
This is a header with sans-serif font
This is a header with a serif font.
CSS Font Size
You can manipulate the size of your fonts by using values, percentages, or key terms. The example is below:
Example:
p { font-size: 120%; }
ol{ font-size: 13px; }
ul{ font-size: x-large; }
Output:
This is a font size of 120%
- This is a font size of 13px
- This is a font size of "x-large"
CSS Font Style
CSS Font-Style is where you define if your font will be italic or not. Possible key terms are the following: italic, oblique, and normal.
Example
p { font-style: italic; }
h4{ font-style: oblique; }
