CSS font-weight字重数值及对应的字重描述词语

最新推荐文章于 2024-05-23 22:59:55 发布
最新推荐文章于 2024-05-23 22:59:55 发布
阅读量225 收藏
点赞数 2
文章标签： css 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44443380/article/details/138657425
版权

1、以下是一些常见的 font-weight 数值及其对应的描述词语：

  1. 100 - Thin (细)
  2. 200 - Extra Light (超细)
  3. 300 - Light (细)
  4. 400 - Normal (正常)
  5. 500 - Medium (中等)
  6. 600 - Semi Bold (半粗)
  7. 700 - Bold (粗)
  8. 800 - Extra Bold (超粗)
  9. 900 - Black (极粗)

2、此外，还有一些关键字可以用于 font-weight 属性：

  • normal：等同于 400
  • bold：等同于 700
  • bolder：比父元素的 font-weight 更粗
  • lighter：比父元素的 font-weight 更细
半城风月-
关注
  • 2
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
CSS font-family为英文和中文字体分别设置不同的字体
12-13
font-family的调用方法: 复制代码代码如下: div { font-family:Arial,’Times New Roman’,’Microsoft YaHei’,SimHei; font:bold 12px/0.75em Arial,’Times New Roman’,’Microsoft YaHei’,SimHei; } 根据...
设计的字重与前端的font-weight
还想做MAD
05-08 2699
字重（weight），是指相对于字高度的笔画粗细（stroke width）程度。 一个字体（typeface）的某个字型（font）的字重常常至少4-6个，其中正常与黑体几乎是必备的： 100 - 淡体 Thin ( Hairline ) 200 - 特细 Extra-light ( ultra-light ) 300 - 细体 Light 350 - 次细 Demi-Light 4...
font-weight
吴佩佩佩佩的博客
07-01 3004
font-weight
UI写的font-weight对应的数值
weixin_45663702的博客
05-17 3900
在实际工作中，我们前端一般根据UI设计图来还原页面效果，而UI通常会在字重（font-weight）写上Regular、Normal、Medium、Light。。。我们肯定是需要将它转换为对应的数值。
改变font-weight的数值,样式并不会改变的原因
weixin_38168918的博客
08-05 1427
通常情况下,一个特定的字体仅会包含少数的可用字重。若所指定的字重不存在直接匹配,则会通过字体匹配算法规则匹配使用邻近的可用字重。这也就是为什么我们有时候使用特定字重时没有“生效”,看起来跟其它字重差不多的原因所在。 总结: 1.在实际中,最为常用的字重是normal,bold或100-900; 2.normal:正常的字体,相当于数字值400。bold:粗体,相当于数字值700。 ...
【CSS】你真的了解font-weight吗?
青春木鱼的博客
11-11 4543
font-weight我们很多人都用过，甚至经常用，但你们真的了解font-weight吗？今天我带大家深入了解一下font-weight
font-weight设置了为什么没生效
qq_32102987的博客
12-05 1695
通常情况下，一个特定的字体仅会包含少数的可用字重。若所指定的字重不存在直接匹配，则会通过字体匹配算法规则匹配使用邻近的可用字重。这也就是为什么我们有时候使用特定字重时没有“生效”，看起来跟其它字重差不多的原因所在
你真的了解font-weight吗?
热门推荐
mystonelxj的博客
03-01 1万+
原文出处：https://www.cnblogs.com/starof/p/4562514.html font-weight可取值：100～900和normal、bold、bolder、lighter。 如果字体使用九阶有序数值100～900来划分其字重(字体的粗细度)，那么样式指定的font-weight属性值与字体的字重则一一对应。并且normal等价于400，bold等价于700。 但...
css解决font-weight:blod跳动问题的解决
12-14
a:hover{font-weight:blod} 结果鼠标悬停的时候，页面会有跳动的现象。因为改变字体的时候改变了元素的大小，所以引起了页面的重排，所以会有跳动的现象。 实现方式2： a:hover{text-shadow: 1px 0 0 currentColor;...
font-weight-values:CSS font-weight属性的有效值
05-21
字体重量值 有效的，除了 [ " normal " , " bold " , ... var fontWeightValues = require ( 'shinnn/font-weight-values' ) ; 单机版 原料药 fontWeightValues 类型： String Array 执照 未经许可
css中默认中文字体font-family列表
09-25
css中文字体font-family列表主要是系统自带的一些、装Office会生出来的一些、Windows的一些，感兴趣的朋友可以了解下
移动端/PC端布局-flex布局
微木
05-22 106
flex布局详解
前端 CSS 经典：3D 渐变轮播图
weixin_64684095的博客
05-23 402
前言：无论什么样式的轮播图，核心 JS 实现原理都差不多。所以小伙伴们，还是需要了解一下核心 JS 实验原理的。
CSS常用的两种定位方式
代码有点萌的博客
05-23 346
relative定位是相对自身原始位置进行偏移。absolute定位是相对于最近的已定位（relativeabsolutefixedsticky）祖先元素进行偏移。如果没有已定位的祖先元素，则相对于初始包含块（通常是视口）进行定位。相对自身原始位置进行偏移。元素仍占据原始位置的空间。用于微调元素位置，不会影响其他元素的布局。脱离文档流，相对于最近的已定位祖先元素进行定位。不占据空间，其他元素会忽略它的位置。用于精确定位元素，通常与relative定位的祖先元素配合使用。
Web开发——HTML&CSS
一切皆是定数的博客
05-20 386
HTML：HyperText Markup Language，超文本标记语言超文本：超越了文本的限制，比普通文本更强大。除了文字信息，还可以定义图片、音频、视频等内容。标记语言：由标签构成的语言，HTML标签都是预定义好的。HTML代码直接在浏览器中运行，HTML标签由浏览器解析。CSS：Cascading Style Sheet，层叠样式表，用于控制页面的样式（表现）。以下就是html代码以及css样式搭配之后的显示效果。
SCSS基本使用
最新发布
mj256115的博客
05-23 380
SCSS（Sassy CSS）是一种 CSS 预处理器，它是 CSS 语言的一个扩展，增加了变量、嵌套规则、混合（mixins）、函数等功能，使得编写 CSS 更加高效和易于维护。SCSS 代码最终会被编译成标准的 CSS 代码。
CSS font-weight：700 失效问题
07-08
关于CSS的font-weight属性失效问题，可能有几个原因导致： 1. 字体不支持所选的粗细：某些字体可能只提供了常规（normal）和粗体（bold）两种粗细选项，不支持其他数值。如果你选择了不支持的数值，那么样式将无效。你可以尝试使用其他数值或者更换字体。 2. 字体文件未正确加载：如果你使用了自定义字体文件或者Web字体，但是文件没有正确加载，那么样式将无效。你可以检查网络请求，确保字体文件加载成功。 3. 样式被后续CSS规则覆盖：可能有其他CSS规则在后续样式表中对同一个元素进行了样式设置，并且覆盖了font-weight属性的设置。你可以使用浏览器的开发者工具检查元素的样式规则，看是否被其他规则覆盖。 4. CSS优先级冲突：如果有多个CSS规则应用在同一个元素上，并且具有相同的优先级，那么后面的规则会覆盖前面的规则。你可以检查是否有其他具有相同优先级的规则干扰了font-weight属性的设置。 总结起来，检查字体支持、字体文件加载、样式覆盖和优先级冲突这些方面，可能能够解决CSS font-weight失效的问题。如果问题仍然存在，可以提供更多的细节和代码示例，以便更好地帮助你解决问题。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值