在html css中加粗显示,在CSS里面如何实现字体加粗

在word里面实现文字加粗是一件轻而易举的事。我们直接点击加粗按钮就可以完成。但是在css里面没有加粗按钮呀，那么如何实现字体加粗呢？下面小编向大家简单介绍一下。

1.使用font-weight属性

一说到在CSS里实现加粗，大家第一反应是不是使用font-weight属性。没错，这是在CSS实现加粗的方法之一。

font-weight属性的值可以是： normal 、 bold、 bolder 、 lighter 、 number。

normal: 正常的字体，相当于number为400，声明此值将取消之前任何设置

bold: 粗体，相当于number为700，也相当于html b 加粗对象的作用

bolder: IE5+特粗体

lighter: IE5+细体

number: IE5+100|200|300|400|500|600|700|800|900

这个属性我们最常用的值是bold，当然你也可以实际需要调整number数值达到自己所需的效果。

实例:

效果:

看到这个效果,你是否有这样一个疑问:怎么数值900和bold的效果差不多呀?bold不是相当于数值700吗?这是因为加粗作用是由用户端系统安装的字体的特定字体变量映射决定。系统选择最近的匹配。也就是说，用户可能看不到不同值之间的差异。

2.html常规加粗标签

除了font-weight属性之外，我们还有方法对字体实施加粗吗？

我们先看看下面的代码:

运行:

嘿嘿!由上图我们可以看到运行效果跟font-weight属性差不多喔！因此我们可以得出：使用html标签或也能达到加粗的效果。

在html css中加粗显示,在CSS里面如何实现字体加粗相关推荐

css中横线中间显示文字
css中横线中间显示文字,类似文档地图注脚 <div style="width:100%;height:36px;line-height:36px;display:flex;" ...
CSS中Display（显示）和Visibility（可见）
CSS中常见的显示属性Display和可见属性Visibility display属性设置一个元素应如何显示,visibility属性指定一个元素应可见还是隐藏. 隐藏元素 - display:non ...
面试总结（CSS 的盒模型？、CSS 中选择器的优先级以及 CSS 权重如何计算？、CSS 中哪些属性可继承，哪些不可以？、CSS 单位中 px、em 和 rem 的区别？、rem 适配....)
CSS 的盒模型? 盒子模型(Box Modle)可以用来对元素进行布局,包括内边距,边框,外边距,和实际内容这几个部分第一种是 W3C 标准的盒子 ...
产生粗体字的html标签,html字体加粗用css设置文字粗体样式
html如何加粗文字,HTML加粗标签元素有哪些?CSS字体加粗又怎么来实现?粗体代码是什么? 综合以上问题,可以使用CSS样式和HTML标签两种方法来实现,在实际布局时候根据需要来选择文字字体加粗方 ...
css中div居中显示的四种方法
css中设置div元素居中显示的四种方法一.先确定div的基本样式二.具体实现方法第一种:利用子绝父相和margin: auto实现第二种:利用子绝父相和过渡动画tranform实现第三种: ...
div css将文字居中显示图片,css文字居中、图片居中、div居中解决方案
一.文字居中若文字只有一行文本只有一行 .box { width: 200px; height: 200px; background-color: red; } .text { line-heig ...
css中背景颜色用哪个,CSS 背景颜色
颜色背景 CSS中背景颜色由background-color决定,这里的背景颜色会渲染padding和content,不会渲染border和margin部分. 在css3中可以通过background ...
css中indent是什么意思,css中text-indent用法及与padding的区别详解
语法: text-indent : length 参数: length : 百分比数字|由浮点数字和单位标识符组成的长度值,允许为负值.请参阅长度单位说明: 检索或设置对象中的文本的缩进. 在被另一 ...
css中什么是伪元素,CSS伪元素是什么？
什么?伪元素?之前不是说了伪类吗,怎么又跑出来一个伪元素吗?它们不是一样的吗?呵呵,其实伪类和伪元素是两个不同的概念,今天小编就为大家介绍一下伪元素. 一.什么是伪元素 css伪元素代表了某个元素的子 ...

在html css中加粗显示,在CSS里面如何实现字体加粗

在html css中加粗显示,在CSS里面如何实现字体加粗相关推荐

最新文章

热门文章