好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

font-weight

CSS font-weight 属性用于指定文字的粗细程度。

font-weight 属性通过关键字或数值来指定字体的粗细程度。数值可以是100,200,300,400,500,600,700,800,900。每一个数值等级都比上一个等级显示的字体要粗一些。关键字是具体数值的映射,例如, normal 代表数值400, bold 代表数值700。可用的关键字有: normal , bold , bolder 和 lighter 。

例如下图中显示的是Raleway字体从100-900 9个等级的粗细字体。

某些字体只有 normal 和 bold 两种字体粗细类型。在这些字体上以数值的形式设置 font-weight 属性只会得到两种结果。如下图显示了微软雅黑字体9个等级字体粗细的情况。

bolder 和 lighter 关键字根据父元素的字体粗细值来计算当前元素的字体粗细程度。计算方法根据下表的规则来进行。

父元素的font-weight值 bolder lighter 100 400 100 200 400 100 300 400 100 400 700 100 500 700 100 600 900 400 700 900 400 800 900 700 900 900 700

官方语法
font-weight: normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
                            

参数:

normal :和数值400相同。 bold :和数值700相同。 bolder :指定比父元素的字体更粗的字体。 lighter :指定比父元素的字体更细的字体。 100-900 :9个等级的字体粗细程度。

font-weight 属性的初始值为 normal 。

应用范围

font-weight 属性可以应用在所有的元素上。

示例代码
font-weight: 300;
font-weight: 900;
font-weight: normal
font-weight: bold;
font-weight: bolder;
font-weight: lighter;                              
                            
在线演示

Raleway字体9个粗细等级的在线演示效果如下:

Raleway字体

浏览器支持

所有的浏览器都支持 font-weight 属性,包括Chrome, Firefox, Safari, Opera, Internet Explorer 以及 Android 和 iOS。

查看更多关于font-weight的详细内容...

  阅读:36次

上一篇: font-size-adjust

下一篇:min-height

CopyRight:2016-2025好得很程序员自学网 备案ICP:湘ICP备09009000号-16 http://www.haodehen.cn
本站资讯不构成任何建议,仅限于个人分享,参考须谨慎!
本网站对有关资料所引致的错误、不确或遗漏,概不负任何法律责任。
本网站刊载的所有内容(包括但不仅限文字、图片、LOGO、音频、视频、软件、程序等)版权归原作者所有。任何单位或个人认为本网站中的内容可能涉嫌侵犯其知识产权或存在不实内容时,请及时通知本站,予以删除。

网站内容来源于网络分享,如有侵权发邮箱到:kenbest@126.com,收到邮件我们会即时下线处理。
网站框架支持:HDHCMS   51LA统计 百度统计
Copyright © 2018-2025 「好得很程序员自学网
[ SiteMap ]