它如何工作css字体权重值? [英] How it works css font-weight values?

查看:393
本文介绍了它如何工作css字体权重值?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我不明白字体权重值。当我把它改变为粗体,正常或600+,也改变字体。但改为100到500,不改变任何东西。为什么要这些值?

解决方案

font-weight 100至900,反映了设计字体的不同重量字体的印刷实践。非常少的字体具有所有这些权重,但是已经选择比例以或多或少地覆盖所使用的不同权重。 CSS3字体草案描述了数字和传统印刷术语之间的对应关系,例如Thin ,Extra Light等,但术语真的不一样。



在排版中,每个重量是由排版者设计的一种独立的字体。这是大多数字体只有两个或者只有一个权重的一个原因:设计字体需要时间,时间就是金钱。特别适用于在网络上使用的字体的另一个原因是显示设备相当粗糙,使得精细排版通常是相当无意义的尝试。特别是,小字体高度在低分辨率设备上不能很好地工作。



CSS规范定义了一种算法,用于将声明的字体权重映射到可用的权重。例如,当只有重量400和700可用(通常情况)时,则权重100,200和300被映射到400.然而,在一些情况下浏览器算法粗体字形。这是一个问题,而不是一个解决方案,并且由于浏览器的差异,如果你要求一个不存在的权重,它可能会导致奇怪的事情。大多数浏览器似乎使用算法粗体,如果要求600或更高的权重,并且字体只有正常(400)字体。例如,当文本在Arial Unicode MS(没有粗体字体)中时,设置 font-weight:bold 会创建Arial Unicode MS的人为粗体版本。



常用字体还有其他问题。有时你需要使用字体名称,如同它是一个字体名称,例如。 font-family:Arial Black 而不是逻辑设置 font-family:Arial; font-weight:900 。有时这不起作用,因为在部分浏览器只有逻辑的方式工作。



一般来说,不要尝试使用其他权重比正常和粗体除非您通过 @ font-face 使用可下载的字体(网络字体),这可以控制字体重量问题。可用作可下载的大多数字体只包含两个基本权重,或只有一个,但有一些有趣的免费字体有几个权重。


I don't understand font-weight values. When I change it as bold , normal or 600+, also changing fonts. But change it as 100 to 500, doesn't change anything. Why have these values?

解决方案

The font-weight values, from 100 to 900, reflect typographic practices of designing different-weight typefaces of a font. Very few fonts have all those weights, but the scale has been selected to cover, more or less, the different weights used. The CSS3 Fonts draft describes a correspondence between the numbers and traditional typographic terms such as Thin, Extra Light, etc., but terminology really varies.

In typography, each weight is a separate typeface designed by typographer. This is one reason why most fonts have just two, or maybe just one, weight: it takes time to design a typeface, and time is money. Another reason especially applicable to fonts as used on the web is that display devices have been rather coarse, making fine typography often a rather pointless attempt. In particular, small font heights don’t work well on low-resolution devices.

The CSS specifications define an algorithm for mapping declared font weights to available weights. For example, when only weights 400 and 700 are available (the usual situation), then weights 100, 200, and 300 are mapped to 400.

However, in some cases browsers algorithmically bold glyphs. This is more of a problem than a solution, and due to browser differences, it may cause odd things if you ask for a nonexistent weight. Most browsers seem to use algorithmic bolding if a weight of 600 or more is requested for and the font only has normal (400) typeface. For example, setting font-weight: bold when text is in Arial Unicode MS (which has no bold typeface) creates an artificially bolded version of Arial Unicode MS.

There are additional problems with commonly available fonts. Sometimes you need to use a typeface name as if it were a font name, e.g. font-family: Arial Black instead of the logical setting font-family: Arial; font-weight: 900. Sometimes this does not work, since on some browsers only the logical way works.

As a rule, don’t try to use other weights than normal and bold unless you use downloadable fonts (web fonts) via @font-face, which gives you control over the font weight issue. Most fonts that can be used as downloadable contain just the two basic weights, or just one, but there are interesting free fonts with several weights.

这篇关于它如何工作css字体权重值?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆