What are the attributes for setting fonts in html?

Set the font attributes in html: font, font-family, font-size, font-style, font-variant, font-weight, "@font-face", font-size-adjust, font- stretch.

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

Font properties define font, bold, size, and text style.

Set the font attributes in html

Attributes	Description
font	Set all font properties in one declaration
font-family	Specify the font family of the text
font-size	Specify the font size of the text
font-style	Specify the font style of the text
font-variant	Specifies the font style of the text. Setting the small caps font to display text means that all lowercase letters are converted to uppercase, but all letters using small caps have a smaller font size compared to the rest of the text.
font-weight	Specifies the thickness of the font
@font-face	A rule, Allow websites to download and use other fonts than "Web-safe" fonts
font-size-adjust	Specify aspect values ​​for elements. Specifies an aspect value for an element so that the x-height of the preferred font is maintained.
font-stretch	Shrink or stretch the current font family. Scale and transform the current font-family. Not supported by all major browsers.

Extended information:

In HTML/CSS, there are two types of font family names:

• Universal Font Family - A combination of font systems that share a similar appearance (such as "Serif" or "Monospace")

• Specific Font Family - A specific font family ( Such as "Times" or "Courier")

Generic family	Font family	Description
Serif	Times New Roman Georgia	Serif font characters have at the end of the line Additional Decoration
Sans-serif	Arial Verdana	"Sans" means none - these fonts have no additional decoration at the end
Monospace	Courier New Lucida Console	All monospace characters have the same width

The font-family property should set several font names as a "fallback" mechanism if browsing The first font is not supported by the browser, it will try the next font.

Note: If the name of the font family is more than one character, it must be in quotation marks, such as Font Family: "宋体".

Multiple font families are specified by separating them with a comma:

p{font-family:"Times New Roman", Times, serif;}

The following are some commonly used font combinations and common font families.

Serif Font

##FontText ExampleGeorgia, serif"Palatino Linotype", "Book Antiqua", Palatino, serif##"Times New Roman", Times, serifThis is a heading

sans - serif字体

	This is a heading This is a paragraph
	This is a heading This is a paragraph
	This is a paragraph

字体	文本示例
Arial, Helvetica, sans-serif	This is a heading This is a paragraph
Arial Black, Gadget, sans-serif	This is a heading This is a paragraph
"Comic Sans MS", cursive, sans-serif	This is a heading This is a paragraph
Impact, Charcoal, sans-serif	This is a heading This is a paragraph
"Lucida Sans Unicode", "Lucida Grande", sans-serif	This is a heading This is a paragraph
Tahoma, Geneva, sans-serif	This is a heading This is a paragraph
"Trebuchet MS", Helvetica, sans-serif	This is a heading This is a paragraph
Verdana, Geneva, sans-serif	This is a heading This is a paragraph

Monospace 字体

字体	文本示例
"Courier New", Courier, monospace	This is a heading This is a paragraph
"Lucida Console", Monaco, monospace	This is a heading This is a paragraph

（学习视频分享：css视频教程）

The above is the detailed content of What are the attributes for setting fonts in html?. For more information, please follow other related articles on the PHP Chinese website!