font-weight

语法

font-weight：normal | bold | bolder | lighter | <integer>
默认值：normal
适用于：所有元素
继承性：有
动画性：是
计算值：数字重量值

取值

normal：正常的字体。相当于数字值400
bold：粗体。相当于数字值700。
bolder：定义比继承值更重的值
lighter：定义比继承值更轻的值
<integer>：用数字表示文本字体粗细。取值范围：100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900

说明

设置或检索对象中的文本字体的粗细。

作用由客户端系统安装的字体的特定字体变量映射决定。系统选择最近的匹配。也就是说，用户可能看不到不同值之间的差异。
对应的脚本特性为fontWeight。

兼容性

            <table class="compatible">

Values IE Firefox Chrome Safari Opera iOS Safari Android Browser Android Chrome Basic Support 6.0+ 2.0+ 4.0+ 3.1+ 3.5+ 3.2+ 2.1+ 18.0+ </table>

示例


<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>



<style>
.test p{margin:15px 0;border:1px solid #000;}
.normal p{font-weight:normal;}
.bold p{font-weight:bold;}
.bolder p{font-weight:bolder;}
.lighter p{font-weight:lighter;}
.number p{font-weight:700;}
</style>
</head>
<body>
<ul class="test">
    <li class="normal">
        <strong>正常的字体：</strong>
        <p>本段文字将显示为正常的字体。</p>
    </li>
    <li class="bold">
        <strong>粗体：</strong>
        <p>本段文字将显示为粗体。</p>
    </li>
    <li class="bolder">
        <strong>特粗体：</strong>
        <p>本段文字将显示为特粗体。</p>
    </li>
    <li class="lighter">
        <strong>细体：</strong>
        <p>本段文字将显示为细体。</p>
    </li>
    <li class="number">
        <strong>用number值表示粗体：</strong>
        <p>本段文字将显示为粗体。</p>
    </li>
</ul>
</body>
</html>