Code highlights logo


Visual Rules

Font Family

Font family refers to the specific typeface used for text rendering on a web page. The font family can be changed to give a web page a distinct look and feel.

Specifying Font Family

Font family can be specified in the CSS file using the font-family property. For example:

1body {
2 font-family: 'Arial', sans-serif;

In this example, the font-family property is being used to set the font family for the entire body of the web page to Arial. The sans-serif fallback is used in case the Arial font is not available on the user's device.

Choosing Font Families

In order to ensure that our web pages are accessible across different devices and screen sizes, it is important to make use of common font families which tend to be more common and available across all platforms.

For instance, sans-serif is a common font family that is widely available to most web users. If you are unsure of which font family to use, it is recommended to use a generic family name as the first choice followed by a specific font name.



Add font-family: "Times New Roman"; to the h1.title selector.


Add font-family: Arial, sans-serif; to the body selector.


Add font-family: Verdana, sans-serif; to the ol and ul selectors.

Sign up to start coding

Already have an account?

Sign In

Course content