1. CSS Styles
Fonts and Colors

2. Adding a splash of color
Colors

3. Reserved Colors Names
You will specify font color with the color property.
You can see the list of reserved color words here:

4. RGB Colors
With Red/Green/Blue colors you specify the amount of each color that is mixed together to make your desired color. Like with paint 

5. Hex Values
These are six digit codes preceded by a hash sign with represent the color:

6. Background Color
To specify the background color you use the background property.

7. Transparency
Here we will make the background of the paragraph slightly transparent using rgba
The last letter in rgba stands for alpha, indicating the about of transparency.

8. Let’s make our letters pretty 
Text
Let’s make our letters pretty 

9. Serif Font
Serif Font’s are fonts with little curly cues on them.
These are optimized for print, but not as easy to read on the computer. So I wouldn’t put them on your website 
e.g. Georgia, Times New Roman
Sample Text
Curly Cue

10. Sample Text Sans-Serif Font These font’s don’t have the curly cues.
They are optimized for computers
Use Sans-Serif font’s on your website
e.g. Arial, Verdana, Helvetica
No Curly Cue
Sample Text

11. Font Family To specify your font you can put it in the font family.
Often you specify the font-family in the body tag so it applies to all the text in your document.
You can then change the font-family of individual styles accordingly.

12. Font size
Most commonly, font sizes are specified in pixels.

13. Font Weight This property controls the boldness of your font.
You can specify the boldness in terms of words or numbers
Boldness
lighter
normal
bold
bolder
Boldness
100
200 …
900 OR

14. Font Style You can specify one of three font styles… Style Description
Normal
Italic
Oblique
Displays the normal font style on an angle

15. Text Decoration
We can add strikethroughs and underlines with text decoration
Options
none
underline
overline
line-through
blink

16. Text Alignment Just like in Microsoft Word, you can align:
left, right, center, or justify

17. Giving links their own flair
Styling Links
Giving links their own flair

18. Links Links have a few different states
We can style each state differently
State
Description
:link
Before it’s been visited
:visited
After it’s been clicked removed from most browsers
:hover
When the user is hovering over it
:active
When the user clicks it

19. Links
Let’s style them 