css 字体加粗设置指的是将网页上的文字加粗显示。这种效果可以通过 css 样式表中的 font-weight 属性来实现。
font-weight 属性指定了字体的粗细,其值可以是数字或者关键字。常用的关键字包括 normal、bold、bolder 和 lighter。
下面是具体的设置方法:
- 使用数字:数值越大,字体粗细程度越高,通常在100~900之间。例如:
p {
font-weight: 700;
}- 使用关键字 normal 和 bold:normal 表示正常的字体粗细程度,而 bold 表示加粗的字体粗细程度。例如:
h1 {
font-weight: normal;
}
h2 {
font-weight: bold;
}此外,如果想要将字体加粗一点或减少一点,也可以使用关键字 bolder 和 lighter。不同浏览器对于这两个关键字的处理可能会有所不同,通常可以用以下方式来设置:
p {
font-weight: 600; /*更加粗一点*/
}
h1 {
font-weight: lighter; /*减少粗细*/
}需要注意的是,加粗的效果会同时影响文字的粗细和大小,因此在设置字体加粗时需要考虑到这两个因素的影响。另外,虽然加粗可以使文字更加易读,但是过度使用也会影响网页的可读性,所以需要谨慎使用。
立即学习“前端免费学习笔记(深入)”;
最后,需要指出的是,在实际的开发中,我们往往会使用 CSS 预处理器来更加方便地管理样式。例如,在 Sass 中可以使用类似以下的语法:
p {
font-weight: bold;
&.extra-bold {
font-weight: 900;
}
}这样就可以通过添加一个额外的类名(.extra-bold)来将指定元素的字体粗细程度增加到最大。这种方式尤其适合在多个元素之间共享样式时使用。










