css The font-family attribute is used to specify the font of an element. Font-family can save multiple font names as a "fallback" system. If the browser doesn't support the first font, it will try the next one.
How to use the css font-family property?
Attribute definition and usage instructions
font - The family attribute specifies the font of an element.
font-family can save multiple font names as a "fallback" system. If the browser doesn't support the first font, it will try the next one.
There are two types of font family names:
family-name - specified family name:
The name of the specific font, such as: " times", "courier", "arial".
generic-family - Common font family names:
For example: "serif", "sans-serif", "cursive", "fantasy", "monospace.
The use of a specific font family (Geneva) depends entirely on whether that font family is available on the user's machine; this attribute does not indicate any font download. Therefore, using a generic font family name as a fallback is highly recommended.
Note: Separate each value with a comma.
Note: If the font name contains spaces, it must be enclosed in quotes. When using the "style" attribute in HTML , single quotes must be used.
Default value: not specified
Inheritance: yes
Version: CSS1
JavaScript Syntax:
object.style.fontFamily="arial,sans-serif"
Attribute value
family-name, a priority list for the font family name or/and class family name of an element.
generic-family, default value: depends on the browser.
inherit Specifies that the font family should be inherited from the parent element.
Example
Specifies the paragraph Font:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style> p.serif{font-family:"Times New Roman",Times,serif;} p.sansserif{font-family:Arial,Helvetica,sans-serif;} </style> </head> <body> <h1>CSS font-family</h1> <p class="serif">这一段的字体是 Times New Roman </p> <p class="sansserif">这一段的字体是 Arial.</p> </body> </html>
Effect:
The above is the detailed content of How to use css font-family property. For more information, please follow other related articles on the PHP Chinese website!