Shulou(Shulou.com)05/31 Report--

The knowledge of this article "how to set font properties in html" is not understood by most people, so the editor summarizes the following contents, detailed contents, clear steps, and has a certain reference value. I hope you can get something after reading this article. Let's take a look at this "how to set font properties in html" article.

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

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

Set font properties in html

Property description font sets all font properties in a declaration font-family specifies the font family of the text font-size specifies the font size of the text font-style defines the font style of the text font-variant specifies the font style of the text. Set the font for small uppercase letters to display text, which means that all lowercase letters are converted to uppercase, but all letters that use small uppercase fonts have a smaller font size than the rest of the text. Font-weight specifies the weight of fonts @ font-face a rule that allows websites to download and use other fonts other than "Web- safe" fonts font-size-adjust to specify aspect values for elements. Specify an aspect value for an element so that you can maintain the x-height of the preferred font. Font-stretch shrinks or stretches the current font family. Stretch the current font-family. All major browsers do not support it.

Extended data:

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

Common font family-A combination of font systems with 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 SerifTimes New Roman

Characters in GeorgiaSerif fonts have extra decorative Sans-serifArial at the end of the line

Verdana "Sans" means none-these fonts have no extra decorative MonospaceCourier New at the end

All Lucida Console characters of equal width have the same width

The font-family property should set several font names as a "backup" mechanism, and if the browser does not support the first font, it will try the next font.

Note: if the name of the font family is more than one word, it must be in quotation marks, such as Font Family: "Arial".

Multiple font families are indicated by a comma separation:

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

Here are some common font combinations, common font families.

Serif font

Font text example Georgia, serifThis is a heading

This is a paragraph

"Palatino Linotype", "Book Antiqua", Palatino, serifThis is a heading

This is a paragraph

"Times New Roman", Times, serifThis is a heading

This is a paragraph

Sans-serif font

Font text example Arial, Helvetica, sans-serifThis is a heading

This is a paragraph

Arial Black, Gadget, sans-serifThis is a heading

This is a paragraph

"Comic Sans MS", cursive, sans-serifThis is a heading

This is a paragraph

Impact, Charcoal, sans-serifThis is a heading

This is a paragraph

"Lucida Sans Unicode", "Lucida Grande", sans-serifThis is a heading

This is a paragraph

Tahoma, Geneva, sans-serifThis is a heading

This is a paragraph

"Trebuchet MS", Helvetica, sans-serifThis is a heading

This is a paragraph

Verdana, Geneva, sans-serifThis is a heading

This is a paragraph

Monospace font

Font text example "Courier New", Courier, monospaceThis is a heading

This is a paragraph

"Lucida Console", Monaco, monospaceThis is a heading

This is a paragraph

The above is about the content of this article on "how to set font properties in html". I believe we all have a certain understanding. I hope the content shared by the editor will be helpful to you. If you want to know more about the relevant knowledge, please follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.