px

px像素(Pixel)。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。

任意浏览器的默认字体高都是16px.

em

em是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置,则相对于浏览器的默认字体尺寸。

  1. em的值并不是固定的;
  2. em会继承父级元素的字体大小。

rem

使用rem为元素设定字体大小时,仍然是相对大小,但相对的只是HTML根元素。rem可谓集相对大小和绝对大小的优点于一身,通过它既可以做到只修改根元素就成比例地调整所有字体大小,又可以避免字体大小逐层复合的连锁反应。

When you touch SCSS files please add a UI Dev as a reviewer otherwise it makes it very hard for us to keep track of the Design System evolution code wise (e.g. most of B2B font size values are set in px when we agreed a long time ago to either use rems or sass variables as well as to steer clear of CSS Grid).

更多Jerry的原创文章,尽在:“汪子熙”:

SAP Spartacus里px,em和rem的应用相关推荐

  1. SAP Spartacus 里的 icon 设计

    同 SAP Fiori 一样,SAP Spartacus 里也有大量的自定义 icon 设计,比如下图的 iconTypes.RESET: 需要调用 iconLoader 获取 RESET icon ...

  2. Media Query在SAP Spartacus里的用途

    Media queries are useful when you want to modify your site or app depending on a device's general ty ...

  3. SAP Spartacus里的feature module

    SAP Spartacus里Component的使用受featureModule控制:

  4. web开发中的长度单位(px,em,ex,rem),如何运用,看完这篇就够了!

    原创 2017-03-08 web小二 web前端开发 作为一名前端开发人员,css中的长度单位,都是我们在工作中非常熟悉的名词,因为没有它们,我们就不能声明某个字符应该多大,或者某些图像周围应该留白 ...

  5. SAP Spartacus 里的 .release-it.json 文件

    在 SAP Spartacus package.json 里有一个依赖叫做 release-it: 这个工具的链接:https://github.com/release-it/release-it 这 ...

  6. 如何找到 SAP Spartacus 里某个 Component TypeScript 编译后生成的 JavaScript 位置

    需求 如何找到触发该网络请求的准确代码位置? 从 initiator 里查看调用栈上下文,一点头绪也没有. 找到触发该网络请求的控件的 selector:cx-register 在 Storefron ...

  7. SAP Spartacus 里的 cxOutletRef 指令执行过程分析

    先看 cxOutletRef 指令的效果:ng-template 里定义了如下图标 1 区域所示的自定义 UI,通过 cxOutletRef, 将其插入到图标 2 所示的 ProductDetails ...

  8. SAP Spartacus里的localStorage用法

    window-ref.ts: get nativeWindow(): Window {return typeof window !== 'undefined' ? window : undefined ...

  9. SAP Spartacus里product数据请求的HTTP url是在哪里维护的

    我们打开SAP Spartacus home页面时,能观察到product carousel里待显示的product数据从后台被请求: 随便点开一个url,格式如下: https://jerry.ea ...

最新文章

  1. VS2015 Qt5
  2. 华为卡槽打不开怎么办_又牛又贵!华为5G折叠屏手机惊艳全球,售价1.75万!网友却讨论......
  3. redis启动.停止.重启
  4. 正则表达式30分钟入门教程--deerchao
  5. Ubuntu 13.10 用sogou拼音替换ibus-转
  6. Notepad++ WebEdit插件
  7. p2p网络中的NAT穿透
  8. matlab中polyfit和polyval的使用(曲线拟合/多项式拟合/指数拟合)
  9. [羊城杯 2020]A Piece Of Java
  10. 第九周项目四----广义表算法库及应用1
  11. 卢克的HTML与CSS基础
  12. 超长干货!最全数据指标分析!
  13. XTUOJ-1293-Diamond
  14. 腾讯云服务器的项目部署
  15. 百度指数爬虫城市对应代码
  16. 2021水利水电安全员模拟考试多选题库及答案
  17. 计算机视觉——SIFT描述子
  18. 基于Vue的医院内部管理系统(医生、患者、挂号、药房)文档+答辩PPt+项目源码+演示视频
  19. HTTP协议Header选项解读
  20. something about MyBatis

热门文章

  1. IPv6实验1_IPv6地址配置
  2. linux bash 和 sh的区别
  3. Cocos2d-x跨AndroidiOS平台开发入门
  4. ASP.NET和C#中对XML的操作,以及简单的xml与xsl !
  5. 整理 | 软件与工具的收集汇总及推荐
  6. *args 和**kwargs 的理解以及 函数的参数的总结
  7. 配置phpmyadmin的认证方式 wamp下的phpmyadmin密码修改
  8. 典型用户分析及用户场景分析
  9. 在Simplicity Studio下创建适用于EFR32的工程项目
  10. CI框架源码阅读笔记7 配置管理组件 Config.php