首页
学习
活动
专区
工具
TVP
发布

移动适配的长度单位

rem单位 效果:屏幕宽度不同,网页元素尺寸不同(等比缩放) 与px单位或百分比布局对比: px单位是绝对单位 百分比布局特点宽度自适应,高度固定 rem单位是相对单位 rem单位是相对于HTML标签的字号计算结果...像素尺寸转换rem: 1.根据视口宽度,设置不同的HTML标签字号 2.确定设计稿对应的设备的HTML标签字号 查看设计稿宽度 → 确定参考设备宽度(视口宽度) → 确定基准根字号(1/10视口宽度)...3.得出rem单位的尺寸,并书写代码 rem单位的尺寸=px单位数值/基准根字号 *例:计算68px是多个rem?...运算:完成px单位到rem单位转换 加减乘直接书写计算表达式。...=px单位数值/(1/100视口宽度) 注:在开发中,vw和 vh不会混用,因为 vh是1/100视口高度,全面屏视口高度尺寸大,如果混用可能会导致盒子变形。

1.2K20
您找到你想要的搜索结果了吗?
是的
没有找到

CSS中常见的长度单位

1.CSS中常见的长度单位 名称 英文全称 中文名 相对/绝对长度 换算 描述 % percentage 百分比 相对 原长度*百分数 px pixel 像素...) mm millimeter 毫米 cm centimeter 厘米 pt point 磅 1pt=1/72in≈0.3527mm 磅一般为重量单位,但是在印刷行业可作为长度单位...字体大小是指字在屏幕或印刷介质上表现出来的大小,将每个字看作方块,按方块的对角线长度计算大小。...CSS3中新增的度量单位 (1)ch——字符0(零)的宽度; (2)rem——根元素(html元素)的em; (3)vw——viewpoint width,视窗宽度,1vw等于视窗宽度的1%;...(2)rem单位感觉就是px+em的变体,是否值得使用还要看你自己的取舍:没有px精确也没有em灵活。 如果没有定义font-size怎么办? (3)浏览器支持情况。

1.2K20

长度单位、calc() 表达式

长度单位 绝对长度单位 绝对长度单位代表一个物理测量 // 像素px(pixels):在web上,像素px是典型的度量单位,很多其他长度单位直接映射成像素。...最终,它们被按照像素处理 // 像素其实也算相对单位 // 英寸in(inches) 1in = 2.54cm = 96px  // 厘米cm(centimeters) 1cm = 10mm...0.0139in = 1/72*2.54cm = 1/72*96px = 1.33px // 派卡pc(picas) 1pc = 12pt = 1/6in = 1/6*96px = 16px 字体相关相对长度单位...长度值目前比较常用的是:px(像素)、em、%(百分比),要注意其实这三种单位都是相对单位 像素 px 像素为什么是相对单位呢?...当无法确定数字0宽度时,取em值的一半作为ch值 兼容性:IE8-不支持 ch在实际中主要用于盲文排版 视口相关相对长度单位 视口相关的长度值相对于初始包含块的大小。

77210

Android 中的长度单位详解

如果设置表示长度、高度等属性时可以使用 dp 或 sp。但如果设置字体,需要使用 sp。 dp 是与密度无关,sp除了与密度无关外,还与 scale 无关。...1dp=1sp=1px 二、介绍一下px 但如果使用 px 作单位,如果屏幕大小不变(假设还是3.2 寸),而屏幕密度变成了320。...也就是说,如果使用 dp 和 sp,系统会根据屏幕密度的变化自动进行转换。下面看一下其他单位的含义px:表示屏幕实际的象素。...例如,形容手机屏幕大小,经常说,3.2(英)寸、3.5(英)寸、4(英)寸就是指这个单位。 这些尺寸是屏幕的对角线长度。...总之:字体大小按像素来就用px,按物理长度来就用dp,按物理长度但是和系统字体有关系用sp

47210

CSS 你到底有多少长度单位

它们的兼容性如下 视口比例单位 vh、vw、vmin、vmax 在 css3 中新增了和 Viewport 相关的四个单位,随着时间推移,目前各浏览器环境也能跟上了,这也是当前/未来最建议的在伸缩方案中用的单位...它到底是绝对单位还是相对单位?...px 我们称之为像素,即屏幕图形显示的一个点(最小单位),这个点有它的位置、颜色等信息,从这个意义上来说 px 是绝对单位;但每一屏幕上的最小单位1像素对应物理单位是可以变化的,比如1px=1mm、1px...=1cm,这取决于设备,所以也会有说它是相对单位的情况。...总结 实际项目中,我们不可能也不应该仅使用单一的单位来处理所有的细节,充分认识各单位的意义,合理结合才是最好的。

42020

聊一聊CSS中的长度单位

因为使用场景多,因此CSS也提供了许多长度单位。...输出媒介 推荐 偶尔使用 不推荐 屏幕 em, px, % ex pt, cm, mm, in, pc 打印 em, cm, mm, in, pt, pc, % px, ex 除了和输出媒介的关系,这些单位可以从长度值的计算方式区分为绝对单位和相对单位...绝对单位 绝对单位(px,cm, mm,in,Q,pt和pc)意味着以此为单位长度值与其代表的物理长度相等,比如width: 1cm即与现实世界中的1cm长度相等,也意味着绝对单位在所有的媒介上的显示效果是一致的...因为px和in的关系为1in=96px, 在低分辨率设备上,1px为1像素(pixel,也是px名称的由来)长度,而低分辨率的屏幕上1px往往大于1/96in,所以从px计算得到的其他绝对单位值都不准确...相对单位意味着长度值是根据其他长度计算得出的。

99670

分享:CSS长度单位:px和pt的区别

这样很明白,px是一个点,它不是自然界的长度单位,谁能说出一个“点”有多长多大么?可以画的很小,也可以很大。如果点很小,那画面就清晰,我们称它为“分辨率高”,反之,就是“分辨率低”。...所以,“点”的大小是会“变”的,也称为“相对长度”。 pt全称为point,但中文不叫“点”,查金山词霸可以看到,确切的说法是一个专用的印刷单位“磅”,大小为1/72英寸。...所以它是一个自然界标准的长度单位,也称为“绝对长度”。 因此就有这样的说法,在网页设计中,pixel是相对大小,而point是绝对大小。...所以如果在定义字体大小时,使用px作为单位,那一旦用户改变显示器分辨率从800到1024,用户实际看到的文字就要变“小”(自然长度单位),甚至会看不清,影响浏览。...最后整理一下所有出现过的单位: px:pixel,像素,屏幕上显示的最小单位,用于网页设计,直观方便; pt:point,是一个标准的长度单位,1pt=1/72英寸,用于印刷业,非常简单易用; em

2.1K20

再看CSS长度单位使用,做到胸有成竹

要历经样式修改和功能需求修改的反反复复,如果没有对CSS 长度单位做到成竹在胸,那么随着时间的增长,设置将越来越乱,要了老命嘞~ 绝对单位和相对单位 CSS有多种表示长度的不同单位。...长度是一个数字,后跟一个长度单位,例如10px,2em等。 长度单位有两种:绝对单位和相对单位。...绝对长度单位是固定的,用任一一个单位长度表示的大小将是固定的一个大小值。...相对长度单位指定相对于另一个长度属性的长度。相对长度单位在不同渲染介质之间缩放更好。...转换关系:在100%缩放比例下,1个css像素等于1个设备像素。 dpr 为什么移动端设计稿通常是 750px ?

12410

ABAP之单位转换的详细用法

这是我参与「掘金日新计划 · 12 月更文挑战」的第25天,点击查看活动详情 序 HELLO,这里百里,一个学习中的ABAPER,在工作中,我们在MM模块中,展示ALV界面中会经常使用单位字段.这个字段是分成明暗码的情况...为什么要单位转换 在SAP中会出现使用的单位和展示出来的单位不一致的情况.我们这举个例子, 比如 'HZS' 对应的 单位就是 '张' ,一张两张的张....如何进行单位转换 在SAP的单位转化其实很简单. 我们这里讲述两种单位转换的方式. 第一种,WRITE...TO ......WRITE 暗码单位 TO 工作区字段 第二种 调用函数替换 CALL FUNCTION 'CONVERSION_EXIT_CUNIT_OUTPUT'       EXPORTING         ...结果 如图我们输入的'HZS' ,经过两种方式的转换后,最终输出的结果为中文的'张' . 还是要注意语言环境. 否则会失效 . 百里鸡汤 未觉池塘春草梦, 阶前梧叶已秋声。

83230

【CSS】浅谈 CSS 中常用的相对长度单位 em, rem

浅谈CSS中常用的相对长度单位 顾名思义,相对单位是根据与其他事物的关系来度量。所以,要注意到,所度量的实际距离,可能会因为不在其控制之下的其他因素而改变。如屏幕分辨率、可视区域的宽高等等。...并且,对于某些相对单位,其大小会因使用该单位的元素的不同而不同。 em CSS中,em 被定义为给定字体的font-size值。如果一个元素的font-size为14px,那么1em=14px。...但是,我们前面说到,相对单位的大小会因为使用该单位的元素的不同而不同。...rem 这个单位代表相对于根元素的 font-size 大小(例如 元素的font-size)。当用在根元素的font-size上面时 ,它代表了它的初始值。...那么有人会问,为什么px是相对单位呢? 在使用不同设备输出时,眼睛与设备输出的典型距离是不同的。比如电脑显示器,通常是一臂之距,而看书和纸张时(对应于打印机的设备输出),则通常会更近一些。

16420

论CSS中可使用的font-size的长度单位

CSS给开发者提供了许多种长度单位,用于各种不同的CSS属性,如 margin, padding, line-height还有 font-size。为了满足不同的需求,我们有了各种各样的长度单位。...不同情况下,适用的长度单位是不同的。例如,如果你需要元素的 width或者 height依赖于视窗的宽度或者高度,那么最可靠的长度单位就是 vh, vw, vmin以及 vmax。...本文里, 你可以学习到不同的长度单位,以及它们是如何影响其元素中的字体大小的。 像素单位(px) 像素是固定的长度单位。它们是根据用户屏幕上的每一个点的尺寸确定的。...Em 使用em作为长度单位可以帮你避免任何被用户设置覆盖产生的问题。设置 font-size为1em的元素实际高度依赖与浏览器设置。除非用户或者你在其他地方设置,其默认大小是16px。...结论 本文里,我们讨论了在CSS中使用不同单位长度以及它们各自的不同之处。总的来说,你可以尽量避免使用绝对单位,应该多尝试使用相对单位

2.3K20
领券