CSS font-weight 属性

最新推荐文章于 2024-07-06 00:45:26 发布

shengyin714959

最新推荐文章于 2024-07-06 00:45:26 发布

阅读量275

点赞数

CC 4.0 BY-SA版权

分类专栏：笔记文章标签： css 前端 html

本文链接：https://blog.youkuaiyun.com/shengyin714959/article/details/132844353

笔记专栏收录该内容

2377 篇文章 ¥19.90 ¥99.00

订阅专栏

超级会员免费看

本文介绍了CSS中的font-weight属性，用于设置文本的粗细。通过实例展示了normal、bold和900等不同值的效果，详细解释了属性的使用说明，并列出了浏览器的支持情况。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

实例

三段文字设置不同的字体粗细：

p.normal {font-weight:normal;} p.thick {font-weight:bold;} p.thicker {font-weight:900;}

尝试一下 »

属性定义及使用说明

font-weight 属性设置文本的粗细

默认值：	normal
继承：	yes
版本：	CSS1
JavaScript 语法：	object.style.fontWeight="900"

浏览器支持

表格中的数字表示支持该属性的第一个浏览器版本号。

属性
font-weight

了解本专栏

订阅专栏解锁全文

超级会员免费看

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

shengyin714959

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
打赏
打赏
打赏举报

举报

专栏目录

订阅专栏

记录一次关于css font-weight引发的风波

发果叁

11-07

1365

在最近的一次开发中，设计同事说我设置的页面标题字体很粗，想让我调细一些，起初，我以为只是一个很简单的问题，但是调整的时候，发现事情并没有这么简单，于是，写下这篇文章记录踩过的坑。整理了一套《前端大厂面试宝典》，包含了HTML、CSS、JavaScript、HTTP、TCP协议、浏览器、VUE、React、数据结构和算法，一共201道面试题，并对每个问题作出了回答和解析。

在 CSS 中，`font-weight` 属性用于设置文本的粗细。

2302_82146345的博客

06-14

1015

相对粗细（如 `lighter` 和 `bolder`）相对于父元素的 `font-weight` 来计算，如果父元素没有明确设置 `font-weight`，则会使用默认值（通常是 `normal`）。- 尽量使用关键字值（如 `normal` 和 `bold`），因为它们更易于理解和维护。- `800` 到 `900` 之间的数值用于非常加粗的字体效果。- `100` 到 `400` 之间的数值对应于正常粗细的字体。- `500` 到 `700` 之间的数值对应于加粗的字体。

参与评论您还未登录，请先登录后发表或查看评论

深入了解font-weight

凹凸实验室

11-08

3657

问题提出font-weight的属性值有100、200、300、400、500、600、700、800、900和normal、bold、lighter、bolder，它们的区别是？另外，在实际开发中，我们应该使用数值表达还是文字表达呢？认识font-weight根据W3C Fonts节章的规范标准，可知：font-weight可取值：100～900和normal、bold、bolder、light...

CSS font-weight

elevent_zhao的博客

11-02

487

CSS font-weight概述值相对粗细值的解析常见粗细值名称和数值对应概述 font-weight CSS 属性指定了字体的粗细程度。一些字体只提供 normal 和 bold 两种值值 normal 正常粗细。与400等值。 bold 加粗。与700等值。 lighter 比从父元素继承来的值更细(处在字体可行的粗细值范围内)。 bolder 比从父元素继承来的值更粗 (处在字体可行的粗细值范围内)。一个介于 1 和 1000 (包含) 之间的类型值。更大的数值代表字体重量粗于更小的

【CSS】CSS 文本样式 ② ( font 字体设置 | CSS 2.0手册使用 | font-weight 字体粗细设置 | font-style 字体斜体设置 | font 字体样式综合写法 )

让学习成为一种习惯 ( 韩曙亮の技术博客 )

02-28

7986

一、 CSS 2.0手册使用 1、按照文档层次查找 2、搜索关键字查找文档二、 font-weight 字体粗细设置 1、语法简介 2、代码示例三、 font-style 字体斜体设置 1、语法简介 2、代码示例四、 font 字体样式综合写法 1、语法简介 2、代码示例 ① 不使用综合字体样式的代码 ② 使用综合字体样式的代码 ③ 执行效果

css div里引用em字体会变斜体_CSS文字加粗斜体[解决代码]

weixin_28736335的博客

12-29

815

CSS如何给文字加粗，这是小白常见的问题，今天俺跟大家总结分享。标签解决办法一般老的浏览器可能会使用类似或来加粗文字用来设置斜体，例如以下代码：加粗字体加粗字体斜体但是此办法语义化不是很好，设置字体加粗推荐使用下面的另外一种方法。CSS解决设置font-weight也可以用来给字加粗，而且在实际项目中使用这种方法更多。参数值normal : 正常的字体。相当于number为400。声明此值将取消之...

font-weight-values:CSS font-weight属性的有效值

05-21

字体重量值有效的，除了 [ " normal " , " bold " , ... var fontWeightValues = require ( 'shinnn/font-weight-values' ) ; 单机版原料药 fontWeightValues 类型： String Array 执照未经许可

css解决font-weight:blod跳动问题的解决

12-14

`font-weight`属性是CSS中用于设置文本字体的粗细的，其值可以是数字（100到900，数值越大字体越粗）或者预定义的关键词（如`normal`、`bold`等）。当我们将`font-weight`设置为`bold`时，浏览器会尝试找到一个比...

CSS font-weight属性值及其应用与安装教程

资源摘要信息:"CSS font-weight属性的有效值" 在网页设计和开发中，字体样式的设置对于页面的整体美观和用户体验至关重要。CSS（层叠样式表）是实现这一目标的主要技术之一。font-weight属性是CSS中的一个关键属性...

font-weight 属性设置文本的粗细介绍

09-25

`font-weight`属性是CSS（层叠样式表）中用于控制文本粗细的重要工具，它允许开发者调整元素内的文本视觉效果，使其更加突出或者柔和。这个属性主要应用于那些需要强调或者区分不同层次信息的场景，比如标题、副标题...

css字体粗细font-weight属性

最新发布

2301_76255666的博客

07-06

537

在html中使用<strong></strong>或<b></b>标记来设置字体加粗。在CSS中可以使用font-weight属性设置文本字体的粗细。

（7）css常用属性2

Java田根旺

11-25

4360

一、font-weight属性 1.1font-weight属性的作用作用：设置文字是否加粗显示。属性名：font-weight，属于 font 属性的一个单一属性。属性值有两种方式：单词类型、数字类型。 1.2font-weight属性单词类型属性值：normal：默认值，定义标准的字体 bold：定义粗体字符，b、strong标签的默认值。 bolder：定义更粗的字体 lighter：定义更细的字体示例：定义4个p标签 <body> <

CSS核心样式-01-字体属性与文本属性

m0_48670609的博客

06-29

4739

CSS常用样式——字体样式和文本样式

CSS进阶知识

qq_36392801的博客

07-10

464

CSS进阶知识 CSS 常用样式页面修饰类：字体文本样式，背景样式。布局类：盒模型，浮动，定位。字体粗细 font-weight 属性值有俩种：单词类型，数字类型。单词类型 1 normal 默认值标准字体 2 bold 粗体 3 bolder 更粗 4 lighter 更细数字类型在 100-900 之间的整百数字。数字越大，字体越粗。字体风格 font-style 设置文字是否斜体显示 normal 正规字体一般标签的默认值 italic 斜体文字主要针对英文 obliq

前端八股-css篇

m0_65310613的博客

07-29

1294

盒模型组成：padding、margin、border、content。transform原理：占据原始位置进行动画，不会触发回流和重绘；Transition 强调过渡：类似flash的补间动画，一个。Animation 强调每帧流程：类似flash的补间动画，transform属性：rotate旋转、缩放、倾斜、移动;），个人还是喜欢原来的css，混用更好。html：1个大 div包裹9个小div。补充：精灵图做动画也可以用上面方法实现。再操作动画，这样不会影响到其他页面了。

CSS 字体粗细 font-weight属性