CSS Fonts

Font Family:

The font style should be used for the text. By offering them to adapt with multiples font options you will save your design looks in case fonts fail.

                          
                            body {
                                font-family: "Arial", sans-serif;
                            }                                                                                                                                                                                                                                                                                  
                          
                        

Generic Font Families:

If the specified font is not available, you can use generic font families as fallbacks.

                          
                            h1 {
                                font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
                            }                                                                                                                                                                                                                                                                                       
                          
                        

Font Size:

Sets the size of the text.

                          
                            h1 {
                                font-size: 24px;
                            }                                                                                                                                                                                                                                                                                      
                          
                        

Font Weight:

Defines the thickness of the characters in the text.

                          
                            strong {
                                font-weight: bold;
                            }                                                                                                                                                                                                                                                                                                                  
                          
                        

Text Alignment:

Aligns the text within its container.

                          
                            p {
                                text-align: justify;
                            }                                                                                                                                                                                                                                                                                                                                              
                          
                        

Text Decoration:

Adds decoration to the text, like underline, overline, or line-through.

                          
                            a {
                                text-decoration: none; /* removes underline from links */
                            }                                                                                                                                                                                                                                                                                                                                                                          
                          
                        

Line Height:

Sets the height of a line of text. It's often used for better readability.

                          
                            article {
                                line-height: 1.5;
                            }                                                                                                                                                                                                                                                                                                                                                                          
                          
                        

Letter Spacing:

Adjusts the space between characters.

                          
                            h2 {
                                letter-spacing: 2px;
                            }                                                                                                                                                                                                                                                                                                                                                                                                     
                          
                        

Word Spacing:

Adjusts the space between words.

                          
                            p {
                                word-spacing: 5px;
                            }                                                                                                                                                                                                                                                                                                                                                                                                                                 
                          
                        

That is the cases where it is possible to be able to use the font attributes of CSS outside of defined styles and format the text in the way one desires.