一分钟看懂font-size单位em的继承问题

最新推荐文章于 2023-07-05 14:47:11 发布
最新推荐文章于 2023-07-05 14:47:11 发布
阅读量939 收藏
点赞数
分类专栏： css样式 文章标签： em
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45077505/article/details/103989559
版权

直接上代码吧
在这里插入图片描述
然后结果图：
在这里插入图片描述
其实就是设置了em单位的元素会继承自己父元素的大小，并不是继承了根元素或者body元素的。

木木゛
关注
专栏目录
如何正确得理解TT字体中的EM_Size
Libresoft实验室
06-28 2339
欢迎使用Markdown编辑器写博客本Markdown编辑器使用StackEdit修改而来，用它写博客，将会带来全新的体验哦： Markdown和扩展Markdown简洁的语法 代码块高亮 图片链接和图片上传 LaTex数学公式 UML序列图和流程图 离线写博客 导入导出Markdown文件 丰富的快捷键 快捷键 加粗 Ctrl + B 斜体 Ctrl + I 引用 Ctrl
整理大厂高频核心前端面试题，五万多字，面试必考
猫老板的豆
09-13 2550
如果 Vue 组件中的 data 是个对象，那么所有复用这个组件的地方，都在使用这个组件里面唯一的一个 data，所有使用组件的地方的 data 都会指向栈内这一个 data 的地址，那么会造成。等待执行栈和微任务队列都执行完毕才会执行，并且在执行完每一个宏任务之后，会去看看微任务队列有没有新添加的任务，如果有，会先将微任务队列中的任务清空，才会继续执行下一个宏任务。异步：是指不进入主线程，而进入任务队列的任务，只有任务队列通知主线程，某个异步任务可以执行了，该任务才会进入主线程。
em的继承性问题
weixin_30602505的博客
03-25 241
常规情况下em继承父级字体大小 但是当元素自身声明font-size时 元素内的em是继承自元素内的font-size的 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="wi...
html em相对值,css中em是相对于父元素还是当前元素的大小？
weixin_39727706的博客
06-18 384
em是CSS中一个比较常用的相对单位，因此有必要注意一些坑点。1em等于当前元素的字体大小，除非你在设置font-size有很多文章说1em是等于父元素的字体大小！这种说法实际上是不准确的。看以下例子：Documentbody{font-size:16px;}div{font-size:32px;padding-bottom:2em;background-color:aquamarine;}会被p...
px/em/rem有什么区别，为什么通常给font-size设置为62.5%
subsistent的博客
03-27 465
1. 这个单位可谓集相对大小和绝对大小的优点于一身，通过它既可以做到只修改根元素就成比例地调整所有字体大小，又可以避免字体大小逐层复合的连锁反应。1. 因为绝大多数浏览器的默认字体大小为 16px ，而将font-size设置为 62.5% 则等价于字体大小的font-size:10px;2. 随之在其他的换算单位，如 rem 的字体换算时，则可以表示为 1rem = 10px， 整数值对于单位的换算会比较方便。2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位；
em是什么？
m0_57236802的博客
07-05 537
是一个相对于当前元素的字体大小的相对单位，所以它的实际大小可能会随着上下文的变化而变化。单位的好处是它可以根据用户的字体设置自动调整大小，使得网页在不同的设备和用户设置下都能保持良好的可读性和布局效果。，还可以用于其他需要指定大小的 CSS 属性，比如。是一种 CSS 的相对单位，用于表示字体的大小。，那么它的字体大小将是其父元素字体大小的两倍。例如，如果一个元素的父元素的。的大小等于当前元素继承的。，即它的字体大小是其父元素。，即它的字体大小是其父元素。的字体大小的两倍，等于。
前端基础知识点-每天一个基本知识点（100+个前端小知识，你是否都知道？）
m0_67394006的博客
03-02 9234
文章目录 前言 第一回合 一、知识点：cookie（21/09/06） 二、知识点：节流和防抖（21/09/07） 三、知识点：var和let以及const（21/09/08） 四：知识点：深拷贝和浅拷贝（21/09/09） 五、知识点：作用域和作用域链（21/09/10） 六、知识点：从输入URL到页面展示这中间发生了什么（21/09/11） 七、知识点：重排和重绘（21/09/12） 八、知识点：TCP和UDP（21/09/13） 九、知识点：三次握手（21/09/15） 十、知识点：绝对定位和相对定
2018春招前端面试: 闯关记(精排精校) | 掘金技术征文
CRPER
03-13 6532
前言 去年年末研发组解散失业, so选择回去学车了,也顺利拿到了驾照 最近回归大深圳….开始踏上漫漫的找工作之路; “拉勾上吊一百年不匹配!!!”,”BOSS直聘日夜没反应!!!” 题目范围涵盖我最近遇到的笔试题和面谈的(CSS/JS/HTTP/Node/Hybrid/Vue/NG/React) emm…..这里不列举哪些公司了, 若是你完整的阅读一...
-CSS-笔记-
April_Aimer的博客
02-07 2246
目标: 学会使用CSS选择器 熟记CSS样式和外观属性 熟练掌握CSS各种选择器 熟练掌握CSS各种选择器 熟练掌握CSS三种显示模式 熟练掌握CSS背景属性 熟练掌握CSS三大特性 熟练掌握CSS盒子模型 熟练掌握CSS浮动 10.熟练掌握CSS定位 11.熟练掌握CSS高级技巧强化CSS typora-copy-images-to: media CSS的发展历程 从HTML被发明开...
综合一
刘群智的博客
07-27 4161
自我介绍 左固定右自适应布局 这是一个很常见的布局，当然也可以实现右侧自适应，左侧自适应。比如常见的网页中，左侧导航栏是固定的，右侧的内容区要自适应浏览器的大小。 现在我们来看下HTML布局： &lt;div id="outer"&gt;   &lt;div id="sidebar" style="height:240px;"&gt;固定宽度区&lt;/div&gt;   &lt;d
【CSS】内联格式化上下文 IFC（inline formatting context）
这道题我不会做...不会做啊..太难了！！
04-16 718
IFC（inline formatting context）问题：font-size与font-family造成的字体高度问题字模（em-square）在字模中绘制字体一个字体的高度行盒（line-box）line-box高度计算的细节：对于内联元素对于行内块元素例如：line-height属性line-height作为行内元素的高度line-height的取值normal\\\（百分比）vertical-align属性基线位置vertical-align作用取值![在这里插入图片描述](https://i
css属性不具有可继承性,CSS有哪些属性可以继承？
weixin_30941189的博客
08-03 3767
1.背景介绍了解css样式表的继承，我们先从文档树(HTML DOM)开始，文档树由HTML元素组成,文档树和家族树类似，也有祖先、后代、父亲、孩子、兄弟css样式表继承指的是，特定的css属性向下传递到后代元素2.知识剖析对于一些可以继承的属性，可以只设置上级的CSS样式表树形，子级(下级)不用设置，会自动继承此CSS属性，可以减少CSS代码，便于维护。那么有哪些属性可以自动继承呢有继承性的属性...
CSS样式中字体大小，建议font-size使用em
小可的笔记本
10-02 707
在如今这个提倡可用性设计以及用户体验设计的网络时代，CSS也是要一同参与其中的。大部分人在CSS代码编写中总是先对整体定义字体尺寸，中文情况下一般为12px，而其实这样以来在通过IE顶部菜单中的“察看-文字大小”设置已无任何作用。对字体感觉太小的浏览者而言无疑是种很不好的用户体验过程。其实这一切都可以避免，那就是使用em单位作为字体显示单位。   浏览器的默认字体高都是16px，所以未经调整的...
vision里面pt与字号大小对应关系
jacberg的专栏
12-25 5671
八号＝5磅(5pt) ==(5/72)*96=6.67 =6px 七号＝5.5磅 ==(5.5/72)*96=7.3 =7px 小六＝6.5磅 ==(6.5/72)*96=8.67 =8px 六号＝7.5磅 ==(7.5/72)*96=10px 小五＝9磅 ==(9/72)*96=12px 号＝10.5磅 ==(10.5/72)*96=14px 小四
px.em单位 rem适配
weixin_47123532的博客
05-27 179
px（像素）单位 px: 一个盒子是100px * 100px px指的是逻辑像素，也叫css像素 在适配时，使用px作为单位并不合适。 像素是图像的基本采样单位，它不是一个确定的物理量，也不是一个具体的点或小方块（尽管可以用点或小方块来呈现），而是一个抽象概念。 不同的设备，其图像基本单位是不同的，比如显示器的点距，可以认为是显示器的物理像素。现在的液晶显示器的点距一般在0.25mm到0.3mm之间。 注意，我们通常所说的显示器分辨率，其实是指桌面设定的分辨率，而不是显示器的物...
CSS常见的尺寸单位有px和em(相对于父元素的font-size来计算的)
weixin_43343144的博客
03-25 1927
参考这里：https://www.w3cplus.com/css/px-to-em
CSS有哪些属性可以继承？
IT修真院：初学者转行到互联网的聚集地
06-03 4976
这里是修真院前端小课堂，每篇分享文从 【背景介绍】【知识剖析】【常见问题】【解决方案】【编码实战】【扩展思考】【更多讨论】【参考文献】 八个方面深度解析前端知识/技能，本篇分享的是： 【CSS有哪些属性可以继承？ 】 1.背景介绍 了解css样式表的继承，我们先从文档树（HTML DOM）开始，文档树由HTML元素组成,文档树和家族树类似，也有祖先、后代、父亲、孩子、兄弟 ...
font-size font-weigh
最新发布
09-23
`font-size` 和 `font-weight` 是两个常用的CSS样式属性，用于控制文本的显示效果。 1. **font-size**：用于设置文本的字体大小。它可以接受相对单位（如em、rem、百分比）、绝对单位（如px、pt、cm等）以及一些...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值