Computer scienceFrontendCSSBasic propertiesWorking with Text

Using Fonts

Theory

File

Report a typo

You now have two files: 'my-font-italic.otf' and 'my-font-bold.otf'. The first is obviously italic and the second is bold. Connect both to your CSS and assign one to .container and the other to .small.

Unfortunately, you won't see the changes of the result after you connect the font. But this is still good practice (and a nice quote from Jamie Zawinski).

Tip: For the first font, font-weight is normal and font-style is italic. For the second font, font-style is normal and font-weight is bold.

Write HTML and CSS code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Best font ever!</title>
</head>
<body>
<div class="container">
<p class="quote">Some people, when confronted with a problem, think ‘I know, I'll use regular expressions.’ Now they have two problems.</p>
<p class="small">― Jamie Zawinski</p>
</div>
</body>
</html>

Completed 0 of 4
First font created
Second font created
___

Create a free account to access the full topic