CSS

The CSS font property is used to control the appearance of text.

CSS Font

Font selection is very important for HTML pages.

Using the CSS font property, it is possible to change the size, color, style and more of the text.

Generic Font Families

CSS has five generic font families.

  • Serif fonts have a short stroke at the edge of each letter.
  • Sans-serif fonts have clean lines (no small strokes attached).
  • Monospace fonts have the same fixed width for all characters.
  • Cursive fonts mimic human handwriting.
  • Fantasy fonts are decorative, expressive fonts.

CSS Font Attributes

Here are some common font attributes:

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

Practice with examples "Try it Now"

You can practice the Oracle command in your machine by following examples.

To see the output for every example click "Try it Now"

Example

#p1 {
  font-family: "Times New Roman", Times, serif;
}
#p2 {
  font-family: Arial, Helvetica, sans-serif;
}
#p3 {
  font-family: "Lucida Console", "Courier New", monospace;
}
Try it Now »

Click on the "Try it Now" button to see how it works.


CSS Font Color

The color attribute is used to change the color of the text.

Example

#p1 {
  color: red;;
}
#p2 {
  color: rgb(0, 255, 76);;
}
#p3 {
  color: #0e02b9;;
}
Try it Now »

Click on the "Try it Now" button to see how it works.