Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

How css uses the font-family property to define the font family of text

2025-03-26 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/01 Report--

This article mainly introduces how css uses font-family attribute to define text font series, the article is very detailed, has a certain reference value, interested friends must read it!

Use common word trivial columns

Suppose you wish to use a sans-serif font for your document, but you don't really care which font it is. Here's an appropriate statement:

body {font-family: sans-serif;}

Try it yourself.

The user agent then selects a font (such as Helvetica) from sans-serif and uses it on the body element. Because there is persistence, this font choice will also apply to all elements swept within the body element, unless a more specific selector overrides it.

Specify font family

In addition to using generic character sub-columns, you can configure more specific fonts via the font-family property.

The following example equips all h2 elements with Georgia fonts:

h2 {font-family: Georgia;}

Try it yourself.

This rule also creates another problem, assuming that the Georgia font is not installed on the user agent, and only the default font of the user agent can be used to display the h2 element.

We can formulate this title problem by grouping specific font names and generic word trivia:

h2 {font-family: Georgia, serif;}

Try it yourself.

If the reader does not have Georgia installed, but has Times font (one of the fonts in the serif column) installed, the user agent may use Times for the h2 element. Although the Times and Georgia are not completely married, they are at most close.

Therefore, we advocate providing a common word system column in all font-family rules. This provides a way to select a candidate font when the user agent cannot provide a specific font that matches the requirements.

If you are very specific about fonts, you can also assume that a given element specifies a family of similar fonts. To do this, it is important to arrange these fonts according to priority criteria and use commas to develop coherence in the future:

p {font-family: Times, TimesNR, 'New Century Schoolbook', Georgia, 'New York', serif;}

Try it yourself.

From this list, the user agent looks up the fonts listed in flashbacks. If none of the fonts listed work, it's easy to decide on an available serif font.

use quotation marks

You may have noticed that the following example uses single quotes. Quotation marks are only necessary in font-family declarations if there is one or more spaces in the font name (such as New York), or if the font name includes symbols such as #or $.

Single or double quotes are acceptable. However, if you place a font-family attribute in HTML's style attribute, you need to use quotes that the attribute itself does not use:

...

The above is "how to use font-family attribute to define font family of text in css" all the contents of this article, thank you for reading! Hope to share the content to help everyone, more relevant knowledge, welcome to pay attention to 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.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report