html5 怎么文字加粗

在HTML5中，文字加粗可以通过使用特定的标签或CSS样式来实现，以下是几种常用的方法：

1、<b> 标签

HTML中的<b>标签是一个内联元素，用于表示文本的视觉上的重要性，通常将其内容以加粗的形式显示，它没有传达任何额外的语义信息，只是单纯地用于视觉效果。

<p>这是一段普通的文本。<b>这部分文字会被加粗。</b></p>

2、<strong> 标签

与<b>不同，<strong>标签除了加粗文字外，还向浏览器和辅助技术（如屏幕阅读器）传达了其包含的文本具有重要性，它在语义上强调了文本的重要性，而不仅仅是视觉上的加粗效果。

<p>这是一段普通的文本。<strong>这部分文字不仅会被加粗，还会被识别为重要文本。</strong></p>

3、CSS font-weight 属性

使用CSS的font-weight属性可以更灵活地控制文字的粗细，通过设置不同的值，可以实现从正常到极粗的不同级别的加粗效果。

<p style="font-weight: bold;">这段文字将显示为加粗。</p>

4、CSS font-weight 属性与类选择器

在实际应用中，通常会将样式规则定义在外部的CSS文件中，并通过类选择器来应用这些样式。

.bold-text {
    font-weight: bold;
}

然后在HTML中使用这个类：

<p class="bold-text">这段文字将显示为加粗。</p>

5、使用其他数值

font-weight可以接受除了bold之外的其他数值，如100至900的整百数值，数值越高，文字越粗，这允许你更精确地控制文字的粗细。

<p style="font-weight: 600;">这段文字将显示为中等加粗。</p>

6、使用继承和初始值

需要注意的是，font-weight属性是可以继承的，这意味着如果父元素设置了font-weight，子元素也会继承这个属性，除非子元素自己有覆盖的设置。font-weight的初始值是normal，相当于数值400，这意味着如果没有特别设置font-weight，文字将显示为正常粗细。

7、使用CSS变量

为了提高可维护性，可以使用CSS变量来定义font-weight的值，然后在需要的地方引用这个变量。

:root {
    --bold-weight: bold;
}
.emphasized-text {
    font-weight: var(--bold-weight);
}

在HTML中使用：

<p class="emphasized-text">这段文字将显示为加粗。</p>

相关问题与解答：

Q1: <b> 和 <strong> 有什么区别？

A1: <b>标签主要用于视觉上的加粗效果，而<strong>标签除了加粗效果外，还向辅助技术传达了文本的重要性。

Q2: 如果我希望文字不仅有加粗效果，还要改变颜色，应该怎么做？

A2: 你可以通过组合使用font-weight和color属性来实现。

<p style="font-weight: bold; color: red;">这段文字将显示为红色并加粗。</p>