html怎麼讓字體加粗-html教學-PHP中文網

首頁

web前端

html教學

html怎麼讓字體加粗

青灯夜游

May 27, 2021 pm 05:42 PM

html

html加粗字體的方法：1、使用「」標籤，語法需要加粗的文字」；2、在標籤中使用style屬性，新增“font-weight:bold|bolder”樣式，值“bold”定義粗體字符，“bolder”定義更粗的字符。

html怎麼讓字體加粗

本教程操作環境：windows7系統、CSS3&&HTML5版、Dell G3電腦。

方法1：使用標籤

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title> <b>加粗字体</title>
	</head>
	<body>
		<div>
			<p>这是一段测试文字，<b>这里使用b标签来加粗字体</b>
			</p>
		</div>
	</body>
</html>

登入後複製

運作效果：

html怎麼讓字體加粗

#從圖中我們已經可以看出，文字的後半段加粗了字體，可以和文字的前半段（文字為加粗）進行比對。這裡我們主要就是使用到了html中的標籤，html的標籤的使用很簡單，直接在標籤中寫上需要加粗字體的文字即可！

方法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>

登入後複製

效果圖：

html怎麼讓字體加粗

說明：

font-weight屬性可以設定文字的粗細，一般用於設定顯示元素的文字中所使用的字體加粗

加粗效果相關的屬性值：

值
#bold	定義粗體字元。
bolder	定義更粗的字元。
100 200 300 400 500 600 700 800 900	定義由細到粗的字元。400 等同於normal，而700 等同於bold。