css中px是什么单位(CSS中px em rem区别与使用)
类别:Web前端 浏览量:2800
时间:2022-01-20 00:51:58 css中px是什么单位
CSS中px em rem区别与使用最近在学习字体时遇到字体大小的设置,font-size单位可以是px或em或rem,那么这几种单位都有什么区别呢,该如何使用呢?
px是像素图像的基本采样单位,相对于显示器屏幕分辨率而已的,什么是一个像素呢,你把一张图一直放大,会看到一个个小的方格子,一个方格子就是一个像素。浏览器默认的字体大小是16px。
px的特点是:字体大小写死固定了,是固定值,老版本IE无法缩放字体,但现在基本上都不用管低版本的IE。所以一般情况都会使用这种单位,够精确。
em是一个相对单位表示相对于其父亲元素字体的大小而言,可以是小数,整数。比如父元素字体大小是16px,则1em就是16px,2em就是32px。
em的特点是:不是固定值,它的值会随着父字体大小而变化。 使用场景:当当前元素的内外边距需要与当前字体大小成比例时,可以使用em。
rem也是一个相对单位与em的区别是,他是相对于根元素而言的,这样在使用计算时就比em简单方便多了,因为他的参考值就是根元素子图大小,浏览器默认的是16px。
rem的特点是:相对于根元素字体大小,计算方便。可以通过控制html根字体大小来改变整个页面字体大小,是页面在哥尺寸的移动端自适应。
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持开心学习网!
您可能感兴趣
- css基线实例详解(移动端使用 rem 单位时 css sprites 定位问题的解决)
- navicat载入sql文件(Navicat Premium如何导入SQL文件的方法步骤)
- python中列表remove的用法汇总(对python_discover方法遍历所有执行的用例详解)
- .NET中IsNullOrEmpty和IsNullOrWhiteSpace的区别
- 云数据库navicat连不上(Navicat Premium15连接云服务器中的数据库问题及遇到坑)
- vue组件轮播(vue+rem自定义轮播图效果)
- navicat连接mysql报错(解决Navicat Premium 连接 MySQL 8.0 报错"1251"的问题分析)
- 如何使用rem开发移动端页面(移动端rem布局的两种实现方法)
- navicat中如何使用sql语句(Navicat Premium操作MySQL数据库执行sql语句)
- rem怎么设置适配(详解如何使用rem或viewport进行移动端适配)
- css中px是什么单位(CSS中px em rem区别与使用)
- css媒体查询常见的媒体类型(css基于媒体查询和 rem 的响应式布局实践)
- vue组件方法里如何修改data(vue项目中使用rem替换px的实现示例)
- navicat for mysql连接测试失败(Navicat Premiun远程连接MySQL报错10038解决方案)
- navicat怎么和mysql连接(Navicat Premium远程连接MySQL数据库的方法)
- css中rem单位
- 手机QQ与小米路由器在一起 明天揭晓,敬请期待(手机QQ与小米路由器在一起)
- 小米音乐与 QQ 音乐合作,便捷迁移会员(小米音乐与QQ音乐合作)
- 小米推出米兔儿童电话手表奥特曼版,799 元,支持微信 QQ(小米推出米兔儿童电话手表奥特曼版)
- 贾怀胤唱《白龙马》 炸场 了 没想到京剧还能这么玩(贾怀胤唱白龙马)
- 白龙马的改编学生版,快来看看(白龙马的改编学生版)
- 萌娃唱《白龙马》走红,那生动的小表情,网友直呼 简直是戏精(萌娃唱白龙马走红)
热门推荐
- 宝塔面板防火墙是自动开的吗(宝塔面板开启隐藏的 waf 防火墙的方法)
- 阿里云rds需要读写分离吗(为什么使用阿里云RDS?使用RDS有什么好处?)
- dede执行查询语句(dede调用指定栏目下相关文章的实现方法)
- web.config里面使用configSource
- 网站如何提高用户体验
- python端口扫描脚本测试(Python实现的IP端口扫描工具类示例)
- linux多线程怎么设置(超详细讲解Linux C++多线程同步的方式)
- idea向数据库中插入中文报错(Idea连接MySQL数据库出现中文乱码的问题)
- html5封闭ios(Html5 页面适配iPhoneX就是那么简单)
- 在linux系统中切换成其他用户(如何在Linux命令行与其他用户通信)
排行榜
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9