CSS Fonts

CSS Fonts

CSS provides several properties for styling fonts on web pages. Here are some common CSS font properties:

  1. font-family: This property is used to specify the font family for text on a web page. You can list multiple font families separated by commas, and the browser will use the first available font on the user’s system. For example:
body {
  font-family: Arial, Helvetica, sans-serif;
}

 

In this example, we’re specifying Arial as the preferred font family, but if it’s not available, the browser will look for Helvetica, and then any sans-serif font.

  1. font-size: This property is used to specify the font size for text on a web page. You can use various units such as pixels, ems, and percentages. For example:
h1 {
  font-size: 32px;
}

In this example, we’re setting the font size ofh1elements to 32 pixels.

  1. font-weight: This property is used to specify the weight (or thickness) of the font. You can use values such asnormal,bold, andlighter, or specify a numeric value such as400or700. For example:
h2 {
  font-weight: bold;
}

In this example, we’re setting the font weight ofh2elements to bold.

  1. font-style: This property is used to specify the style of the font. You can use values such asnormal,italic, andoblique. For example:
p {
  font-style: italic;
}

 

In this example, we’re setting the font style ofpelements to italic.

  1. text-transform: This property is used to transform the case of text. You can use values such asuppercase,lowercase, andcapitalize. For example:
button {
  text-transform: uppercase;
}

In this example, we’re setting the text transform ofbuttonelements to uppercase.

These are just a few of the many CSS font properties available for styling fonts on web pages.

Scroll to Top