em rem vh vw

最新推荐文章于 2023-11-29 10:27:14 发布
最新推荐文章于 2023-11-29 10:27:14 发布
阅读量135 收藏
点赞数
原文链接：http://www.cnblogs.com/awakin/p/10722204.html
版权

em

  • 在做手机端的时候经常会用到的做字体的尺寸单位
  • em就相当于“倍”，相对于父级比较

rem

  • 这里的r就是root的意思，意思是相对于根节点来进行缩放
  • 当有嵌套关系的时候，嵌套关系的元素的字体大小始终按照根节点的字体大小进行缩放。

vh

  • 当前屏幕可见高度的百分比
  • height:100vh == height:100%

vw

  • 当前屏幕宽度的百分比
  • width:100vw == width:100%

转载于:https://www.cnblogs.com/awakin/p/10722204.html

weixin_30709809
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
浅析rem和em和px vh vw和% 移动端长度单位
09-24
下面小编就为大家带来一篇浅析rem和em和px vh vw和% 移动端长度单位。小编觉得挺不错的，现在分享给大家，也给大家做个参考，一起跟随小编过来看看吧
css3中单位px,em,rem,vh,vw,vmin,vmax的区别及浏览器支持情况
09-24
主要介绍了css3中单位px,em,rem,vh,vw,vmin,vmax的区别及浏览器支持情况的相关资料,需要的朋友可以参考下
em rem vw vh
weixin_30436891的博客
06-14 94
一直想写一个关于em和rem的总结，无奈最近因为毕业论文还有工作原因耽搁了！ 刚抽出时间，笔者就想起来博客园估计是要长草了！ 不怕！今天就是来除草的！ 每次写页面的时候，笔者总是手机页面居多，由于工作量不多计算简单，所以我就直接以100%设计页面布局，尽管我知道一旦页面复杂就尴尬了！做到pc端呢，由于美工小姐姐也没有想到自适应，反而就没有要求自适应，所以pc笔者一直也没有做自适应，虽然事实是...
说说em/px/rem/vh/vw的区别
树上骑个猴的博客
03-31 2623
一、介绍 传统的项目开发中，我们只会用到px、%、em这几个单位，它可以适用于大部分的项目开发，且拥有比较良好的兼容性 从CSS3开始，浏览器对计量单位的支持又提升到了另外一个境界，新增了rem、vh、vw、vm等一些新的计量单位 利用这些新的单位开发出比较良好的响应式页面，适应多种不同分辨率的终端，包括移动设备等 二、单位 在css单位中，可以分为长度单位、绝对单位，如下表所指示 CSS单位 相对长度单位 em、ex、ch、rem、vw、vh、vmin、vmax、% 绝对长度单位 cm、mm、in、px
Vue
MMMMMMF的博客
09-06 131
什么是Vue Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。 Vue.js 的基本使用 <div id="app"> <!-- 可以任意使用vue的语法 {{js表达式}} --> {{ 1+2 }} </div> <h1>{{ 1
在 Vue 项目中使用 MQTT
emqx_broker的博客
09-24 6121
Vue 是一款由尤雨溪及其团队开发的渐进式 Javascript 前端框架。该框架具备数据双向绑定、组件化、响应式和轻量等特点，搭配其脚手架 Vue CLI 使得开发者更加容易上手，大大减少了学习成本。同时其配备一个专用的状态管理模式 Vuex ，在这里可以集中管理所有组件的状态。 MQTT 是一种基于发布/订阅模式的 轻量级物联网消息传输协议。该协议提供了一对多的消息分发和应用程序的解耦，具备很小的传输消耗和协议数据交换、最大限度减少网络流量和三种不同消息服务质量等级，满足不同投递需求的优势。 本文主要介
emmmm
qq_43535336的博客
11-24 828
#include&lt;stdio.h&gt; #include&lt;stdlib.h&gt; int main() {     void sort(int array[], int length);     int a[10], i,*array;        array = a;           //将数组a的地址给array     printf("输入：10\n");     fo...
px em rem vh vw 区别
罗布泊丶镜像人的博客
05-27 298
px 固定像素值 em 根据父元素像素大小按照倍数关系从而得到像素值，如果父元素没有设定再找父父元素，最终找根元素 rem 根据根元素像素大小按照倍数关系获得像素值 vh 根据视窗高度百分比设定 vw 根据视窗宽度百分比设定 ...
关于px em rem vh vw那些事儿
会一点点前端
09-21 280
在做移动端响应式布局的时候发现这个知识点还是比较薄弱，记录一下。
px、em、 rem、vh、vw 的区别
alpha_xiao的博客
03-11 6476
1、px：相对长度单位。像素px是相对于显示器屏幕分辨率而言的。 2、em：相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。 3、rem：相对长度单位。r’是“root”的缩写，相对于根元素<html>的字体大小。 4、vh and vw：相对于视口的高度和宽度，而不是父元素的（CSS百分比是相对于包含它的最近的父元素的高度和宽度）。 5、vmin and vmax：关于视口高度和宽度两者的最小值或者最大值。 ...
CSS单位 px、em、rem、vh、vw的区别
qq_45934297的博客
11-29 537
如果浏览器的高为 900px，宽为 500px，则 1vmin = 5px，1vmax = 9px。eg：浏览器宽度为 1000px，那么 1vw = 1000px /100 = 10px。如果没有设置html的字体大小，就会使用浏览器默认字体大小，一般是16px。viewpoint height的缩写，视窗高度，1vh等于视窗高度的1%。viewpoint width的缩写，视窗宽度，1vw等于视窗宽度的1%。如当前父元素的字体尺寸未设置，则相对于浏览器的默认字体尺寸。注：em的值并不是固定的；
CSS 中px、em、rem、%、vw、vh单位之间的区别详解
11-21
本文将详细解析px、em、rem、%、vw和vh这些单位的区别及其应用场景。 1. **px (像素)**: 像素是绝对长度单位，它基于屏幕的物理分辨率。1px表示设备上的一点，通常用于创建精确的图形或保持元素大小恒定。由于px是...
浅析CSS中单位px、rem、em、vh、vw之间的区别
11-20
本文将深入探讨CSS中五个常用的长度单位：px、rem、em、vh和vw，以及它们之间的差异。 1. **像素单位px**： 像素px是最基础的单位，它是一个固定的长度单位，类似于物理世界中的米或厘米。在屏幕上，1px代表显示器...
Source Insight 4.0.zip
08-14
Source Insight 4.0.zip
基础会计教学课件第四章账户与复式记账.pptx
最新发布
08-14
基础会计教学课件第四章账户与复式记账.pptx
L型热电偶和U型热电偶电压温度双向转换器
08-14
L型热电偶和U型热电偶电压温度双向转换器
apache-tomcat-9.0.93安装包（含windows和linux版本）.zip
08-14
apache-tomcat-9.0.93安装包（含windows和linux版本）.zip包含如下内容： apache-tomcat-9.0.93-windows-x64.zip； apache-tomcat-9.0.93-windows-x86.zip； apache-tomcat-9.0.93.exe； apache-tomcat-9.0.93.tar.gz； apache-tomcat-9.0.93.zip；
Processing实验4之灯笼
08-14
思路说明：想画一个中国传统文化灯笼，画完之后，添加4个svg图片，用键盘上1、2、3、4这些数字来控制图片数量，转动鼠标会形成一个个圆。按下鼠标会出现图形，图形和图片不会覆盖住灯笼，按下Backspace或者Delete键盘会清空所画的图形，图片数量不会清空而是恢复到只剩下一个图片。灯笼不会受其他影响，除非改变相应的变量。按下S或者s可以保存png图片，按下E或者e可以保存jpg。
rpx px em rem % vh vw的区别
06-28
rpx是小程序中的单位，可以根据屏幕宽度进行自适应缩放，适用于小程序开发。 px是像素单位，是网页开发中最常用的单位，不具有自适应性。...vh和vw是相对于视口高度和宽度的单位，适用于网页开发中的响应式布局。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值