在css中,可以通过font-weight属性来让字体加粗。font-weight属性可用于设置文本的粗细,一般设置该属性的值为bold或bolder来加粗字体,也可以设置数值来加粗字体。
font-weight属性可以设置的属性值有:
示例1:使用属性值bold或bolder来加粗字体。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>css 字体加粗</title> <style> .a1{ font-weight:bold; } .a2{ font-weight:bolder; } </style> </head> <body> <div> <p>这是一段测试文字<br /> <span class="a1">这里使用bold属性值加粗字体</span><br /> <span class="a2">这里使用bolder属性值加粗字体</span> </p> </div> </body> </html>
效果图:
通过示例,可以知道:这里实现字体加粗效果主要用到了css中的font-weight:bold;和font-weight:bolder;的样式属性。我们应该知道font-weight属性可以设置文本字体的粗细,而设置bold属性值可以定义粗体字符,bolder属性值可以定义更粗的字符,进而实现字体加粗效果。
示例2:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>css 字体加粗</title> <style> .a1{ font-weight:bold; } .a2{ font-weight:800; } </style> </head> <body> <div> <p>这是一段测试文字<br /><br /> <span class="a1">这里使用bold属性值加粗字体</span><br /><br /> <span class="a2">这里使用数值加粗字体</span> </p> </div> </body> </html>
效果图:
说明:
font-weight属性用于设置显示元素的文本中所用的字体加粗。数字值 400 相当于 关键字 normal(标准字体),700 等价于 bold(粗体)。每个数字值对应的字体加粗必须至少与下一个最小数字一样细,而且至少与下一个最大数字一样粗。
以上就是css如何让字体加粗?的详细内容,更多请关注易知道|edz.cc其它相关文章!