CSS3中的rem值与px之间的换算
来源:互联网 发布:oppo网络销售授权书 编辑:程序博客网 时间:2024/05/04 16:14
rem好像也是一个相对大小的值,它是相对于根元素<html>
,比如假设,我们设置html的字体大小的值为html{font-size: 87.5%;}
(也就是14px,这是twentytwelve默认主题里的设置)。然后其他的字体就是将你要的值除以14得到的值;比如默认的twentytwelve主题大小是960px;换算成rem就是960/14=68.57142857142857rem(我这个用电脑的计算器计算的,比默认的更精确,嘿嘿);padding的24px也就是24/14=1.714285714285714rem(当然还是比css文件里的精确),以此类推。
上面的14是个变量,相对于你对根元素html字体大小的设定,如果你设定的是62.5%,那除数就变成10了,对照表如右图:
用这个rem单位的好处有啥我不知道,不过如果你根元素的字体大小选62.5%,那px和rem之间的换算就是px直接除以10就得到rem了,这比em简单多了,到现在我都没搞清楚em和px之间是如何换算的。
另外rem在ie8及ie8以下的版本不支持外其他浏览器都支持,如果你要考虑ie8及一下,可以像twentytwelve默认文件那样设置个px再设置个rem就可以了。
再另外,有许多朋友问我,为啥 html
设置成 62.5%,或者 10px 时,这种换算无效了呢?经过研究发现,不知道什么时候开始,小于 12px 或者 75% 的字体大小 rem 确实不支持这种换算,这可能与现在有些浏览器不支持 12px 以下的大小有关,具体原因不知,反正记住一点:html 必须 12px 以上大小才行。
0 0
- 【CSS3】CSS3中的Rem值与Px之间的换算
- CSS3中的rem值与px之间的换算
- css3中的rem值与px之间的换算
- CSS3 中的 rem 值与 px 之间的换算
- Rem值与Px之间的换算
- CSS3中的rem,em与px间的换算关系
- CSS3中的rem,em与px间的换算关系
- css3开发:rem与px的换算
- 前端px与rem换算
- rem、em与px之间的关系
- rem、em、px换算
- dp,px之间的换算
- css3中rem 与px算法
- 安卓学习笔记--- dp与Px之间的换算
- 如何将html5富文本中的px换算成rem
- H5 px rem 单位换算
- css3单位之间的换算
- px rem em 单位的理解和单位换算
- 将自己的app加入到分享列表中,并适配锤子的one step功能
- [java]自异字符串数组操作类
- Leetcode (316) Remove Duplicate Letters
- 小数位问题
- 软考助手新增加了系统集成项目管理工程师,欢迎下载使用。
- CSS3中的rem值与px之间的换算
- 查看定时任务crontab命令详解
- django日志配置
- repo - contains uncommitted changes .
- Goroutine(协程)为何能处理大并发
- DOM
- eclipse file search file name pattern集合
- 一、usb子系统相关结构体
- debug简单指令学习