• 技术文章 >web前端 >html教程

    html怎么让字体加粗

    青灯夜游青灯夜游2021-05-27 17:43:07原创37415

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

    大前端零基础入门到就业:进入学习

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

    方法1:使用<b>标签

    <!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”样式

    <!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

    说明:

    font-weight属性可以设置文本的粗细,一般用于设置显示元素的文本中所用的字体加粗

    加粗效果相关的属性值:

    描述
    bold定义粗体字符。
    bolder定义更粗的字符。
    • 100
    • 200
    • 300
    • 400
    • 500
    • 600
    • 700
    • 800
    • 900
    定义由细到粗的字符。400 等同于 normal,而 700 等同于 bold。

    推荐教程:《html视频教程

    以上就是html怎么让字体加粗的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。

    前端(VUE)零基础到就业课程:点击学习

    清晰的学习路线+老师随时辅导答疑

    自己动手写 PHP MVC 框架:点击学习

    快速了解MVC架构、了解框架底层运行原理

    专题推荐:html 字体加粗
    上一篇:html如何让input隐藏 下一篇:自己动手写 PHP MVC 框架(40节精讲/巨细/新人进阶必看)

    相关文章推荐

    • ❤️‍🔥共22门课程,总价3725元,会员免费学• ❤️‍🔥接口自动化测试不想写代码?• html a怎么禁止点击• html取消滚动条的方法• html5怎么清除canvas• html5的开发工具有哪些• html如何让input隐藏
    1/1

    PHP中文网