Just because you can add dozens of fonts to every page doesn’t mean you should. Handling font weights and styles in CSS.How to use your own web font files in CSS.
In this tutorial, we’ll discuss various techniques and best practices for adding custom fonts to CSS webpages. The wide availability of open source fonts has encouraged usage of a wide range of fonts by people were previously reluctant to use commercial typefaces with restrictive licenses. However, it took more than a decade for cross-browser support of web fonts to be implemented through the rule set. Basic support for web fonts was introduced in Internet Explorer 4.0, released in 1997.
Web fonts enable you to set the font for your text in CSS, using fonts that are available on the web, and are downloaded along with your website as it is accessed. The solution to this custom font issue was web fonts. Reliable custom font use was only possible with image replacement or plugins such as Flash. This handful of fonts was guaranteed to be available across all browsers and platforms - they are the so-called web safe fonts. In the early days, designers were limited to popular system fonts such as Arial, Verdana, and Times New Roman. Editor’s note: This web fonts in CSS tutorial was last updated on 20 October 2022.
