CSS Font

Home / CSS / CSS Font

CSS Font

CSS-Font :

font-family: This property sets the font for the text within an element. You can specify multiple font families as a fallback in case the user's system doesn't have the first choice. For example:


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


font-size: This property controls the size of the font. You can use various units like pixels (px), ems (em), percentages (%), etc., to specify the size.

For example:

h1 {
  font-size: 24px;
}


font-weight: This property defines the thickness or boldness of the font. Common values are normal, bold, or numeric values like 100, 200, ..., 900.

For example:

p {
  font-weight: bold;
}


font-style: This property specifies whether the font should be italic or normal. Common values are normal and italic.

For example:  

p{
  font-style: italic;
}

font-variant: This property is used to control whether the text should be displayed in small caps. Common values are normal and small-caps.

For example:

p{
  font-variant: small-caps;
}

line-height: Although not part of the font property, line-height is often used to control the spacing between lines of text, which can affect the overall appearance of the font.

For example:


 p{
  font-family: Arial, sans-serif;
  font-size: 16px;
  font-weight: normal;
  font-style: italic;
  line-height: 1.5;
}