CSS Font Styles

Normal Font Style:

Specifies the normal font style.

                          
                            p {
                                font-style: normal;
                            }                                                                                                                                                                                                                                                                                                                                          
                          
                        

This is the default font style.


Italic Font Style:

Sets the text to italic.

                          
                            em {
                                font-style: italic;
                            }                                                                                                                                                                                                                                                                                                                                               
                          
                        

This example makes the text inside <em> tags italic.


Oblique Font Style:

Similar to italic, but the characters are slanted.

                          
                            h1 {
                                font-style: oblique;
                            }                                                                                                                                                                                                                                                                                                                                              
                          
                        

Oblique is less commonly used than italic, and its appearance may vary between browsers.


Combining Font Styles:

You can combine font styles with other font properties.

                          
                            strong {
                                font-style: italic;
                                font-weight: bold;
                            }                                                                                                                                                                                                                                                                                                                                                                          
                          
                        

This example makes the text inside <strong> tags both bold and italic.


Using Shorthand:

The font shorthand property can be used to set multiple font properties, including style.

                          
                            h2 {
                                font: italic bold 16px/1.5 "Times New Roman", serif;
                            }                                                                                                                                                                                                                                                                                                                                                                                                      
                          
                        

This example sets the font style to italic, font weight to bold, font size to 16 pixels, line height to 1.5, and specifies font family options.