html怎么让字体加粗


本文摘自PHP中文网,作者青灯夜游,侵删。

html加粗字体的方法:1、使用“<b>”标签,语法<b>需要加粗的文本</b>”;2、在标签中使用style属性,添加“font-weight:bold|bolder”样式,值“bold”定义粗体字符,“bolder”定义更粗的字符。

本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。

方法1:使用<b>标签

1

2

3

4

5

6

7

8

9

10

11

12

13

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title> <b>加粗字体</title>

    </head>

    <body>

        <div>

            <p>这是一段测试文字,<b>这里使用b标签来加粗字体</b>

            </p>

        </div>

    </body>

</html>

运行效果:

1.png

从图中我们已经可以看出,文字的后半段加粗了字体,可以和文字的前半段(文字为加粗)进行比对。这里我们主要就是使用到了html中的<b>标签,html的<b>标签的使用很简单,直接在<b>标签中写上需要加粗字体的文本即可!

方法2:在标签中使用style属性,添加“font-weight:bold|bolder”样式

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

<!DOCTYPE html>

<html>

 

    <head>

        <meta charset="utf-8">

        <title>css 文字加粗</title>

        <style>

            p.normal {

                font-weight: normal;

            }

            p.bold {

                font-weight: bold;

            }

             

            p.bolder {

                font-weight: bolder;

            }

             

            p.thicker {

                font-weight: 900;

            }

        </style>

    </head>

 

    <body>

        <p class="normal">测试文本!</p>

        <p class="bold">测试文本!</p>

        <p class="bolder">测试文本!</p>

        <p class="thicker">测试文本!</p>

    </body>

 

</html>

效果图:

2.png

说明:

阅读剩余部分

相关阅读 >>

Html表格中的th表头内容怎么居中?th表头标签align属性的具体介绍

Html写网页如何布局

javascript与Html的结合方法详解

Html dialog标签怎么用

Html如何让input隐藏

怎么调超链接的位置Html

如何用Html给图片加边框

Html外部引用css文件不生效的原因

Html和url有什么区别么

Html ins标签怎么用

更多相关阅读请进入《Html》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...