结合css、div谈一谈屏幕尺寸、分辨率、缩放(显示文本、应用等项目的大小)概念

屏幕尺寸,也就是通常我们生活中所说的屏幕大小,23英寸啊、27英寸啊这些,都是我们肉眼可见的大小,也就是指屏幕的对角线尺寸,以英寸单位(1英寸=2.54cm)。

分辨率,通常我们的电脑分辨率为1920*1080等,也就是说显示屏上会显示多少个像素点,像素点越多,屏幕自然也就越清晰。

对于分辨率,常用的属于还有下面这些:

720P的分辨率为1280x720像素
1080P的分辨率为19201080像素
2k的分辨率为2560
1440像素
4k的分辨率为3840*2160像素
8K的分辨率为7680×4320像素
在这里插入图片描述

也就是正常给div一个 width:50px; height:100px; 其中的px就是像素的意思啦~

屏幕缩放(显示文本、应用等项目的大小)
你以为你以为的就是你以为的了?咳,这里所说的缩放指的是这个:
在这里插入图片描述
比如我们给一个div 100px的宽度,但是,我们用测量像素的工具一量,咦?!居然不是100像素,变大了??? 好了,就是因为这个缩放的原因,它把我们本应该100%显示的div宽度,变成了125%。实际上,他就是100px,你改成100%显示就好了。

但是,我们有的电脑就是显示125%比较合适,那咋办呢?此刻就要用自适应的布局啦~ flex布局、单位可以给vw、vh这些,亦可解决。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值