CSS里的各种单位

最新推荐文章于 2024-08-22 12:33:24 发布
原创 最新推荐文章于 2024-08-22 12:33:24 发布 · 361 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

只列举一些我常用到的，后面有需要再补充

单位含义
px相对于屏幕分辨率大小
em相对于父元素的字体大小 。浏览器的默认字体大小都是16px。
rem相对于根元素字体大小
vw相对于视窗的宽度：视窗宽度是100vw
vh相对于视窗的高度：视窗高度是100vh
%相对于父元素。
degdegrees, 角度
CSS单位完全指南
前端小巷子的博客
04-27 1458
在前端开发中，CSS 单位的选择直接影响着页面的布局效果和响应式表现。本文将系统介绍 CSS 中各种单位的特性、使用场景和最佳实践，帮助你做出更明智的选择。
了解和使用CSS中的rem单位
01-08
CSS中的`rem`（root em）单位是一种相对长度单位，用于表示元素的尺寸相对于文档根元素（通常是`<html>`）的字体大小。这个单位在Web设计中被广泛使用，因为它提供了一种更加灵活和一致的方式来控制页面布局，特别是...
CSS常见的 9 个单位汇总！
u013179804的博客
04-29 1835
CSS 单位是 CSS（层叠样式表）中用来指定尺寸、长度和其他度量值的一系列标准，使得样式表能够更精确地控制网页的布局和外观。尺寸定义：CSS 单位用于定义网页元素的大小、间距和位置，包括 width 宽度、height 高度、margin 边距、padding 填充、font-size 字体大小等。响应式设计：通过使用视口单位（如vwvh）和相对单位（如emrem），可以创建能够根据用户设备的屏幕尺寸和分辨率自适应的布局。跨浏览器兼容性：合理的单位选择有助于确保网页在不同浏览器和设备上保持一致的显示效果。
CSS中有哪些单位？
OStriueO的专栏
07-26 1509
2. % (percentage)：百分比单位，相对于父元素的特定属性的值进行计算。6. vh (viewport height)：相对于视窗高度的百分比单位。5. vw (viewport width)：相对于视窗宽度的百分比单位。1vw 等于视窗宽度的1%。4. rem：相对于根元素（html元素）的字体大小的单位。1. px (pixels)：像素单位，是相对于屏幕上的单个像素点的长度单位。3. em：相对于父元素的字体大小的单位。13. ex：相对于字体x-height（小写字母x的高度）的单位。
一文读懂 CSS 单位
最新发布
lsq191690的博客
08-22 1776
说起 CSS 单位，我们最常用的可能就是像素单位（px），它是一个绝对单位，也就是说一个10px的文字，放在哪里都是一样大的。单位可以影响颜色、距离、尺寸等一系列的属性。CSS中单位的形式有很多种，下面就来学习一下 CSS 中单位！
css的各种单位
baibaider的博客
04-09 1545
我常用的单位无非px，rem，deg等等，但今天看到了vw，vh，vm这样的单位，遂决定总结一下。关于单位的相关来自张鑫旭大神，在我的理解上做了些补充~单位含义em相对于父元素的字体大小，若父元素font-size为16px，那么1em就为16pxex相对于小写字母"x"的高度gd一般用在东亚字体排版上，这个与英文并无关系rem相对于根元素字体大小，若根元素font-size为16px，那么1em...
css的常见单位
潮汐未见潮落的博客
05-01 1751
css常见单位的介绍
详解CSS中视窗单位和百分比单位的使用
09-24
在CSS布局中，单位的选择对元素的尺寸控制至关重要。本文主要探讨了视窗单位（Viewport units）和百分比单位在CSS中的应用，这些是初学者理解CSS布局的基础知识。 视窗单位是相对单位，它们的大小直接取决于浏览器...
精选资源
postcss-pxtorem:使用PostCSS将像素单位转换为rem（根em）单位
04-06
postcss-pxtorem 的插件，可从像素单位生成rem单位。 安装 $ npm install postcss postcss-pxtorem --save-dev 用法 像素是最容易使用的单位（观点）。 它们的唯一问题是它们不允许浏览器将默认字体大小更改为16。...
聊一聊CSS中的长度单位的使用
12-11
因为使用场景多，因此CSS也提供了许多长度单位。有的是日常生活中使用的单位，比如：厘米（cm）和英寸（in）；有的是印刷行业使用的单位，比如：point（pt）和pica（pc）；有的是专门为CSS发明的单位，比如：px。 ...
几种CSS单位
yuyubushiyu的博客
08-29 323
px px(pixel)像素，px即为图片大小的最小单位，一张图片由许多像素构成，例如我们常说屏幕分辨率为1600x1200，代表水平方向有1600个像素点，垂直方向有1200个像素点。 em em的参考物是父级元素的font-size，若是自身定义了字体大小，则参考物为自身浏览器默认字体是16px）。 rem 参考物是根元素（html）的font-size。 % 一般是相对于父元素，但是并不十分准确 1、对于普通定位元素就是我们理解的父元素 2、对于position: absolute;的元素是相对于已.
css单位有哪些
weixin_30367945的博客
12-17 252
rem em 我们将从你已经熟悉的东西开始。em单位被定义为当前字体大小。例如，如果你在body元素上设置一个字体大小，那么在body元素内的任何子元素的em值都等于这个字体大小。 <body> <div class="test">Test</div> </body> body { font-size: 14px; } div { f...
css单位
bacu6370的博客
12-18 102
1.px ：像素 　　(计算机屏幕上的一个点)像素越高越清晰 2.em 　　1em 等于当前的字体尺寸。2em 等于当前字体尺寸的两倍。例如，如果某元素以 12pt 显示，那么 2em 是24pt。在 CSS 中，em 是非常有用的单位，因为它可以自动适应用户所使用的字体。 3.fr ：剩余空间分配数 　　 fr单位被用于在一系列长度值中分配剩余空间，如果多个已...
CSS中的单位
LFW的博客
08-07 506
PX(pixel)像素，相对长度单位。像素px是相对于显示器分辨率而言的特点： 1、IE无法调整那些使用px作为单位的字体大小 2、国外的大部分网站能够调整的原因在于其使用了em或者rem作为单位 3、Firefox能够调整px和em，rem，但是96%以上的用户使用IE内核或IE浏览器EM 相对长度单位。相对于当前对象内文本的字体尺寸。 若当前行内文本文本的字体尺寸未被人为设置，则相对于浏
css 所有的单位
Cribug8080的博客
08-12 329
尺寸单位 单位 属性 描述 px 相对 Pixel。相对屏幕分辨率。win96像素/英寸。MAC72像素/英寸。 em 相对 相对于字体。例如：字体14px。1em=14px。2em=28px。 rem 相对 相对于根元素HTML的字体大小，广泛应用于移动端适配 vw 相对 视口宽度的1/100 vh 相对 视口高度的1/100 vmin 相对 相对于视口的宽度...
CSS中的常见单位（px,%,em,rem,vw,vh,vmax,vmin,calc)
楠姐的博客
02-15 3026
CSS中的常见单位区别
CSS常见单位汇总
ITKidKid的博客
08-16 2748
CSS常见单位汇总
CSS单位
小瑾沐晚风的博客
10-01 2024
1.px px像素（Pixel）。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。 PX特点 1. IE无法调整那些使用px作为单位的字体大小； 2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位； 3. Firefox能够调整px和em，rem，但是96%以上的中国网民使用IE浏览器(或内核)。 2.em  em是相对长度单位。相对于当前对象内文本的字体尺...
CSS尺寸单位详解：兼容与实战应用
总结起来，了解并熟练运用这些CSS尺寸单位可以帮助开发者实现更精确、响应式的网页设计，确保在各种设备和浏览器上呈现出一致的用户体验。无论是绝对单位还是相对单位，都各有其适用场景，理解它们的特性和相互转换...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值