北京网站建设>建站知识>开发小记>

开发小记

px,vh,vw,百分比等布局单位的区别

来源:未知 作者:admin 时间:2019-04-02 16:41 点击:

网站开发过程中,很多人可能会对px,vh,vw,百分比等单位有很多的疑惑,其实理解了这些东西,使用起来也是非常的简单,下面就讲解一下讲解网站px,vh,vw,百分比等布局单位的区别。

首先介绍px,px是css样式里最基本的单位,相信大家也不陌生,字体或盒子的宽高布局中使用px单位,那么我们给元素设置多少px就是设置多少px,无论你的电脑屏幕有多大,无论你的手机屏幕有多小,元素的大小是不会改变的,

再说vh与vw,vw的含义是窗口的宽度,我们可以理解为浏览器可视窗口的宽度,100VW等于可视窗口的宽度,同理100VH等于可视窗口的高度,并且这个单位可以给文字使用,可以实现在浏览器视窗窗口的大小发生变化时而改变自身的大小,这个单位类似于百分比,可能很多人也分不清他们的关系,没有关系,一会我们在详细的讲解他们的区别。

现在就是百分比啦,百分比比较好理解,但是在默认的情况下,百分比只能给盒子设置宽度,高度百分比是不生效的,但是可以通过其他方法让百分比高度生效,这里就不进行说明,百分比是继承父级元素的,如果父级是90%或900px的宽度,那么子级的百分之百便是90%或900px的宽度,但vw不同,100vw永远都是满屏的宽度,继承的的是屏幕可视窗口的宽度,vh同理,是继承了可视窗口的高度,与百分比不同的是,使用vh给元素设置高度,是有真实高度的。

rem多用于手机布局,rem更精确,其实rem这个单位本身是死的,什么是死的?就是和px一样,需要通过JS去控制才能达到想要的效果,想要的效果也就类似于百分比。

公司业务:北京网站建设刷百度下拉刷百度指数虚拟主机租用

如转载,请保留本文链接地址:http://www./Web/Diary/2029/

Loading......
工作时间:

AM 09:00 ~ 12:00

PM 14:00 ~ 18:00

联系方式:

Tel 010-50933590

Hp 18701620736

设计优势

独立的设计团队 带给您全新的视觉体验

功能开发

强大的技术实力,完成您想要的任何功能

售后服务

完善的售后服务,解决您在使用过程中遇到的问题

Copyright © 2010 - 2018 北京顺晟科技发展有限公司 All Rights Reserved

地址:北京市顺义区南法信政府府前街16号 炫立方 | TEL:010-50933590

北京网站建设 | 北京网站设计 | 北京SEO公司