CSS Fonts

CSS Font property helps control the look of texts such as text size, color, style and more.

These are the important font attributes:

• font-family
• font-size
• font-style
• font-variant
• font-weight

Let's have a look at each of them:

font-family :

This property Specifies the font family for text.
If the font name contain more than one word, it must be in quotation marks, like: "Times New Roman".

note : You can add more fonts by using coma.If browser failed to load first on ,tries next on.

eg:

.p1 {
  font-family: "Times New Roman"
}

.p2 {
  font-family: Arial
}

.p3 {
  font-family: "Lucida Console",
}

font-size :

This property is used to adjust the size of the font.

h1 {
  font-size: 40px;
}

h2 {
  font-size: 30px;
}

p {
  font-size: 14px;
}

font-style:

This property defines the type of font.
Possible values are : italic, oblique, or normal.

}
h2 { font-style: italic; }
h3 { font-style: oblique; }
h4 { font-style: normal; }
}

font-variant :

This property specifies font variant of an element.
Possible values are : normal and small-caps.

eg:

p { font-variant: small-caps; }
h3 { font-variant: normal; }

font-weight :

This property defines the boldness of the font.
Possible values are : normal, bold, bolder, lighter or number (100, 200..... upto 900).

eg:

p {
    font-weight: 800;
}

---