Update index.md (#23532)

Added bit about using single or double quotes
Removed extra line breaks
This commit is contained in:
Tony Scialdone
2018-11-29 15:23:47 -07:00
committed by Manish Giri
parent 665d59de69
commit e9e85395fb

View File

@ -7,13 +7,16 @@ The CSS font properties define the font family, weight, size, variant, line heig
### Font family ### Font family
The font family of a text is set by using the `font-family` property. The font family of a text is set by using the `font-family` property.
It works with a *fallback* system, meaning if your browser does not support the first font, it tries with the next one and so on. If the name of the font is more than one word it must be surrounded by quotes.
It works with a *fallback* system, meaning if your browser does not support the first font, it tries with the next one and so on. If the name of the font is more than one word it must be surrounded by quotes. Either single quotes `(')` or double quotes `(")` can be used.
```css ```css
p { p {
font-family: "Times New Roman", Times, serif; font-family: "Times New Roman", Times, serif;
} }
``` ```
In the above example, "Times New Roman" is the <family-name> of the font, while "serif" is the <generic-name>. Generic names are used as a fallback In the above example, "Times New Roman" is the <family-name> of the font, while "serif" is the <generic-name>. Generic names are used as a fallback
mechanism for preserving style if the family-name is unavailable. A generic name should always be the last item in the list of font family names. Generic mechanism for preserving style if the family-name is unavailable. A generic name should always be the last item in the list of font family names. Generic
family names are serif, sans-serif, monospace, cursive, fantasy, system-ui. family names are serif, sans-serif, monospace, cursive, fantasy, system-ui.
@ -28,6 +31,7 @@ If you want to use a font that is not downloaded on your computer, you can impor
Then you can use the font that you have imported (in this example, 'Lobster') in your code as normal. Then you can use the font that you have imported (in this example, 'Lobster') in your code as normal.
### Font style ### Font style
The `font-style` property can be used to specify italic text. The `font-style` property can be used to specify italic text.