CSS基础课程登入/注册
在小屏设备上仅提供基本的浏览功能
请使用电脑打开此网页,体验更多强大功能

设置文本的粗体和细体

原创作品,未经许可不得转载
<h1>的默认字体是比较大的,也比正常字体粗一些。在上一节课中,你已经学会了给它设置font-size样式改变它的字体大小。但它仍然比正常的字体要粗一些。那么如何才能使它与正常的字体一样粗细呢?
可通过将它的font-weight样式设为400,使它与正常字体一样粗细。

<h1 style="font-weight:400">
    这是包含在h1中的文本
</h1>
    
font-weight的值可以是:100200300400500600700800。值越大,则字体越粗。但是,并不是所有的浏览器都支持所有的值,最常用的、并且所有浏览器都支持的是400700400是普通字体的粗细程度,700是普通粗体的粗细程度。
如果想将正常粗细程度的字体加粗,则将font-weight的值设为700

<div style="font-weight:700">
    这是加粗的文本
</div>
    
另一种写法是,将font-weight的值设为bold

<div style="font-weight:bold">
    这是加粗的文本
</div>
    
font-weight:boldfont-weight:700是等效的,并且font-weight:bold这种写法更常见。
元素的style属性可以同时设置多个样式。比如,可同时设置字体大小和粗细程度:

<h1 style="font-size:17px;font-weight:400">
    这是包含在h1中的文本
</h1>
    
注意观察语法的书写方式。在多个样式属性之间需用英文分号;分隔。通常情况下,样式属性的先后位置是可以随意的,比如上面的示例中,可将font-weight写在font-size的前面,它们是完全等效的:

<h1 style="font-weight:400;font-size:17px">
    这是包含在h1中的文本
</h1>
    
如果你希望代码更清晰一点的话,可以加入一些空格:

<h1 style="font-weight: 400; font-size: 17px">
    这是包含在h1中的文本
</h1>
    
练习
2/12
http://localhost/