gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Responsive Web Design: Added hint to Specify How Fonts Should Degrade (#24357)

Browse Source 
Added hint to Specify How Fonts Should Degrade (https://learn.freecodecamp.org/responsive-web-design/basic-css/specify-how-fonts-should-degrade and https://guide.freecodecamp.org/certifications/responsive-web-design/basic-css/specify-how-fonts-should-degrade)
This commit is contained in:
Gregory Gubarev
2018-12-08 18:41:33 +04:00
committed by Tom
parent 3c5c78b51b
commit a92c07904a
1 changed files with 23 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
guide/english/certifications/responsive-web-design/basic-css/specify-how-fonts-should-degrade/index.md
View File

@ -3,8 +3,27 @@ title: Specify How Fonts Should Degrade
--- ---
## Specify How Fonts Should Degrade ## Specify How Fonts Should Degrade
This is a stub. <a href='https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/specify-how-fonts-should-degrade/index.md' target='_blank' rel='nofollow'>Help our community expand it</a>.
<a href='https://github.com/freecodecamp/guides/blob/master/README.md' target='_blank' rel='nofollow'>This quick style guide will help ensure your pull request gets accepted</a>.
<!-- The article goes here, in GitHub-flavored Markdown. Feel free to add YouTube videos, images, and CodePen/JSBin embeds --> <!-- The article goes here, in GitHub-flavored Markdown. Feel free to add YouTube videos, images, and CodePen/JSBin embeds -->
We need to apply the ```monospace``` font to the ```h2``` element, so that it now has two fonts - ```Lobster``` and ```monospace```. After, we need to comment out that import of the ```Lobster``` font(using the HTML comments you learned before) from Google Fonts so that it isn't available anymore.
### Solution
To the property ```font-family``` in selector ```h2```, in addition to ```Lobster``` font we need to add ```monospace```:
```css
h2 {
font-family: Lobster, monospace;
}
```
After this, we need to comment import of the ```Lobster``` font:
```css
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
```
select all import and ```ctrl+/```:
```css
<!-- <link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css"> -->
```