3.3字体粗细

最新推荐文章于 2023-02-28 05:15:00 发布

这一片月

最新推荐文章于 2023-02-28 05:15:00 发布

阅读量235

点赞数

文章标签： css

本文链接：https://blog.csdn.net/qq_62865634/article/details/126090101

版权

提示：css使用font-weight属性定义文字粗细。

1、语法：

h1{

font-weight:700;

}

normal:正常字体（不加粗）

bold：粗体（加粗）

bolder：特别粗体

Lighter：细体

number：使用数字加粗

（1）、加粗两种方法：

一种strong、b直接在标签里加。

二种在css里加一个bold。

上面400数值相当于normal：

400=normal（不变粗）

上面700数值相当于bold：

700=bold（变粗）

注意：这个字体粗细不跟单位。

自己代码展示：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>字体加粗、细用css里面font-weight</title>

    <style>
        p {
            /* font-weight: bold; */
            /* 这个700后面不需要跟单位、等价于bold都是加粗效果 */
            /* 在实际开发中我们一般用数字 */
            font-weight: 700;
        }
        
        h1 {
            /* font-weight: normal; */
            font-weight: 400;
        }
    </style>
</head>

<body>
    <h1>小猪佩奇</h1>
    <p>小猪佩奇过大年</p>
    <p>小猪佩奇过大年</p>
    <p>小猪佩奇过大年</p>
    <p>小猪佩奇过大年</p>


</body>

</html>

显示结果：