面试题（px、em、rem三者的区别）

已于 2023-03-09 14:40:09 修改
阅读量552 收藏
点赞数 1
分类专栏： 一阶段css 文章标签： html css
于 2021-06-29 11:11:41 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_55472979/article/details/118329988
版权

px：实际上就是像素，用px设置字体大小时，比较稳定和精准。像素px是相对于显示器屏幕分辨率而言的。

em:就是根据基准来缩放字体大小em的值并不是固定的；em会根据父级元素的字体大小变化。em相对于浏览器的默认字体尺寸。

rem:是根据根元素<html>字体大小变化，这样就意味着，我们只需要在根元素确定一个参考值。

爱嘤嘤嘤斯坦...
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
面试题 说一说px em rem的区别
weixin_50736511的博客
12-12 396
px px单位的名称为像素，它是一个固定大小的单元，像素的计算是针对（电脑/手机）屏幕的，一个像素（1px）就是（电脑/手机）屏幕上的一个点，即屏幕分辨率的最小分割。 由于它是固定大小的单位，单独用它来设计的网页，如果适应大屏幕（电脑），在小屏幕（手机）上就会很不友好，做不到自适应的效果。 利用px设置字体大小及元素宽高等比较稳定和精确。 Px的缺点是其不能适应浏览器缩放时产生的变化，因此一般不用于响应式网站。 em em是相对长度单位。相对于当前对象内文本的字体尺寸。 em相对于父级元素的单位，会随父级元
说说em/px/rem/vh/vw的区别
树上骑个猴的博客
03-31 2622
一、介绍 传统的项目开发中，我们只会用到px、%、em这几个单位，它可以适用于大部分的项目开发，且拥有比较良好的兼容性 从CSS3开始，浏览器对计量单位的支持又提升到了另外一个境界，新增了rem、vh、vw、vm等一些新的计量单位 利用这些新的单位开发出比较良好的响应式页面，适应多种不同分辨率的终端，包括移动设备等 二、单位 在css单位中，可以分为长度单位、绝对单位，如下表所指示 CSS单位 相对长度单位 em、ex、ch、rem、vw、vh、vmin、vmax、% 绝对长度单位 cm、mm、in、px
前端常见面试题：px,em,rem的区别
lucky_girl_girl的博客
02-07 5295
一.px 1.相对长度单位。相对于显示器屏幕分辨率而言。 2.存在浏览器不兼容问题。 二.em 1.相对长度单位。相对于当前对象内文本字体尺寸。 2.em值并不是固定的，em会继承父级元素的大小. 3.如果父级设置font-size:20px. 那么1em=20px. 2em=40px；如果父级设置font-size为30px. 1em=30px. 2em=60px. 4.存在容易造成字体设置混乱...
rem和em的区别 ！前端面试题
业余前端的职业经历
03-14 2242
可能有很多新手小伙伴都知道rem是做手机端适配的,但却并不了解他,虽然并不影响你的使用。但如果是应对面试的话,可不仅仅就是会用就好了 我们先来看俩个例子 // 我写了俩个div <div class="rem"></div> <div class="em"></div> // 样式 一个是以 rem为单位 一个是以em为单位 .rem{ widt...
前端面试题之px em rem的区别
zhouzhou20002000的博客
07-21 576
3.rem相对长度单位默认1rem=16px相当于html元素的字体大小而言的。2.em相对长度单位相对于当前元素的字体大小而言的，默认1em=16px。1.px像素单位相对于屏幕宽高度而言。/*文字到边框的距离*/
前端大厂最新面试题-em_px_rem_vh_vw.docx
06-06
前端大厂最新面试题-em_px_rem_vh_vw 以下是对前端大厂最新面试题-em_px_rem_vh_vw的知识点详细解释： 一、单位的概念 在CSS中，单位可以分为长度单位和绝对单位。长度单位可以进一步分为相对长度单位和绝对长度...
03-px-em-rem-vw-vh-区别.md
最新发布
03-31
本章将通过多个面试题，讲解前端常考的基础知识面试题，同时复习一些重要的知识点。 ## 为何要考察 扎实的前端基础知识，是作为前端工程师的根本。基础知识能保证最基本的使用，即招聘进来能干活，能产出。 ## ...
HTML 38 道面试题及答案.docx
07-09
本文档总结了 HTML 面试题及答案，涵盖了 HTML 中的常见问题，包括垂直水平居中的实现方法、position 属性的作用、px、em、rem 的区别、BFC 的定义和应用、表格自动换行的实现等。 一、垂直水平居中的实现方法 ...
px em rem的区别
weixin_43931898的博客
11-08 361
px px就是css中最基本的长度单位了，用px做单位基本上没什么问题，可以做到让页面按套路精确的展现！可但是！但可是！如果全篇用px布局会暗藏一个尴尬的问题，就是当用户和Ctrl滚页面的时候（说白了就是ctrl+，ctrl-），你会发现页面结构产生了不可预知的错乱，因此有砖家倡导使用em替代px。。。 <!DOCTYPE html> <html> <head&gt...
前端面试题|px、em、rem、wh、vh的使用方法和区别
weixin_48491416的博客
06-29 692
px、em、rem、wh、vh的使用方法和区别
rem、px、em之间的区别
小小马的博客
07-12 330
rem、px、em之间的区别px px是一个物理长度单位,使用px时字体大小无法随着浏览器缩放进行调整 em 相对长度单位，相对于当前对象内文本的字体尺寸,em的值并不是固定,它会继承父级元素的字体大小 rem 相对长度单位，rem设置字体的大小是相对于根元素html而言的，所以我们确定参考值只需要根据根元素确定，使用rem可以只修改根元素就成比例的调整所有字体的大小
前端面试之CSS单位中px、em和rem的区别
qq_60919669的博客
05-05 504
从这篇博客开始，又再次总结一些面试中经常被问到的题目，用精炼的语言去回答面试官的问题，力求做到有的放矢却又表面滴水不漏。 考察点：单位的使用，重点在于rem适配 首先，简单回答一下这三者是什么： px: 绝对单位； em: 相对单位，相对于父盒子的font-size; rem: 相对单位，相对于html根标签 其次，既然是问区别，要稍微说一下三者区别： IE无法调整那些使用px作为单位的字体大小，而em和rem可以缩放，rem相对的只是html根元素。 然后自然而然把重点放到rem这个单位.
关于rem、px、em的区别
x_chengqq
07-12 2231
国内喜欢用px，但是国外一般用的都是em、rem。 1、px特点： 1、IE无法调整px作为单位的字体大小； 2、Firefox能够调整px、em和rem。 px是像素，是相对长度单位，是相对于显示器屏幕分辨率而言的。 2、em特点： 1、em的值并不是固定的； 2、em会继承父级元素的字体大小。 em也是相对长度单位，相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被
px、em、rem、%的区别
qac的博客
12-07 502
css的居中方式 CSS中的居中可分为水平居中和垂直居中。水平居中分为行内元素居中和块状元素居中两种情况，而块状元素又分为定宽块状元素居中和不定宽块状元素居中 一、水平居中 1.行内元素(文本txt，图片img) text-align:center; 2.块级元素居中 01.确定宽度的块级元素(已知块状元素的width且width为固定值) 方法一:margin和width实现水平居中 .content{ width:200px; height:200px; margin:0 auto; } 方法
px,em,rem的区别,工作中怎么做适配
U_Are_My_Halo的博客
04-17 1493
px，em，rem的区别,工作中怎么做适配? 屏幕与分辨率 移动设备与pc设备差别最大的就是屏幕的,体现在屏幕的尺寸和屏幕的分辨率。 屏幕尺寸：屏幕对角线的长度。 屏幕分辨率：表示屏幕水平或垂直方向的像素数。相同尺寸下分辨率越高，越清晰。 像素 物理像素：一个像素点的大小是不固定的，由屏幕生产商在制造时决定，在实际开发中不能基于物理像素进行布局。 css像素：web中推出一个单位 px，可以解...
px、em、rem的区别
qq_47443027的博客
08-03 5799
在做项目的时候用什么单位长度取决于你的需求，我一般是这样的：1、像素（px）：用于元素的边框或定位。2、em/rem：用于做响应式页面，不过我更倾向于rem，因为em不同元素的参照物不一样（都是该元素父元素），所以在计算的时候不方便，相比之下rem就只有一个参照物（html元素），这样计算起来更清晰。1、rem 和 em 单位是由浏览器基于你的设计中的字体大小计算得到的像素值。2、em 单位基于使用他们的元素的字体大小。3、rem 单位基于 html 元素的字体大小。...
px、rem、em的区别与联系
热门推荐
XinKun的博客
02-26 1万+
一、区别： 1. px是固定的像素，一旦设置了就无法因为适应页面大小而改变。 2. em和rem相对于px更具有灵活性，他们是相对长度单位，意思是长度不是定死了的，更适用于响应式布局。 3.em是相对于其父元素来设置字体大小的，一般都是以<body>的“font-size”为基准。这样就会存在一个问题，进行任何元素设置，都有可能需要知道他父元素的大小。而rem是相对于根元素<html>，这样就意味着，我们只需要在根元素确定一个参考值。 总之em相对于父元素，rem相对于根元素。 二、
面试题——（二）rem 布局原理
Lily_lisa的博客
07-13 1653
** rem：相对于根元素(即 html 元素)font-size 计算值的倍数。 通俗的说，1rem = html 的 font-size 值** 这段代码。a 标签的 font-size 值为 0.5rem，实际就是 100px*0.5=50px。 html{font-size:100px;} a{font-size:.5rem;} 用js实现动态设置rem document.documentElement.style.fontSize=document.documentElement.clientWi
css的em是根据什么来写的
weixin_30549657的博客
07-30 153
em是要依靠父元素的值来计算的 1、字体计算公式依旧 1 ÷ 父元素的font-size × 需要转换的像素值 = em值 转自：https://zhidao.baidu.com/question/754489442073667604.html 转载于:https://www.cnblogs.com/ch-zaizai/p/9388988.html...
前端面试题：px, em, rem, vw, vh 的区别解析
在面试中，面试官常常会考察候选人对px、em、rem、vw和vh等单位的理解与应用。以下是对这些单位的详细解释： ### 1. px (像素) **像素**是屏幕上的最小可寻址单元，通常用于精确控制元素大小。px 是一个绝对单位，...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值