期权记-ETF期权开户导航 期权记是专业的50ETF300ETF期权开户投资交易导航

CSS font-weight 属性

font-weight的工作原理

一、使用介绍

font-weight设置文本的粗细,文本粗细设置属于一种比较复杂的字体样式定义,之所以说它复杂,是因为字体本身粗细变化千变万化,没有统一标准,对于字体粗细的具体定义也各不相同。

属性值:normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 继承值

默认值:normal。

font-weight属性值设置有3种方法:

第一种:关键字法:

关键字有2个,normal【默认值,定义标准的字符】和bold【定义粗体字符】。

第二种:相对粗细值法:

相对粗细也是由关键字定义,有2个,bolder【定义更粗的字符】和lighter【定义更细的字符】,但是它的粗细是相对于上级parent元素的继承值而言的。bolder就是匹配字体集中可用的下一级较粗字体,反之"lighter"也一样,匹配下一级较细字体。它们的参照系都是继承值,因此粗细程度都是相对于继承值而言的。

具体情况参考下图:

可用值           值的说明 

normal          缺省值。字体正常显示。 

bold             粗体 

bolder          比粗体更加粗 

lighter          比正常字体淡 

100              至少和200一样淡 

200              至少和100一样粗,至少和300一样淡 

300              至少和200一样粗,至少和400一样淡 

400             字体正常显示,相当于normal。 

500             至少和400一样粗,至少和600一样淡 

600             至少和500一样粗,至少和700一样淡 

700             粗体,相当于bold。 

800             至少和700一样粗,至少和800一样淡 

900             至少和800一样粗 

inherit         从父元素继承字体的粗细

注意:IE7和更早的版本不支持"inherit"的值。IE8需要定义!DOCTYPE。IE9支持"inherit"。

第三种:从"100"到"900"的9个数字序列。

这些数字代表从最细(100)到最粗(900)的字体粗细程度。

数值400相当于normal,

数值700相当于bold。

使用例子:

<!DOCTYPE html>  <html>  	<head>  		<meta charset="UTF-8">  		<title></title>  		<style type="text/css">  			.tt{  				font-weight: 400;  			}  			.yy{  				font-weight: 700;  			}  		</style>  </head>  <body>  <div class="tt">例子001 font-weight: 400;</div>  <div class="yy">例子002 font-weight: 700;</div>  </body>  </html>

本文 2019-06-23 最后编辑

本站声明:网站内容来源于网络,如有侵权,请联系我们https://www.qiquanji.com,我们将及时处理。

微信扫码关注

更新实时通知

作者:期权小韭菜 分类:网页教程 浏览:
请先 登录 再评论,若不是会员请先 注册