新闻转载前端移动端设配rem和vw区别用法

回复

在作前端开发时，经常遇到和宽度单位，由于使用、依赖于视图窗口，故当屏幕分辨率变大或者缩小，尺寸会进行相应的放大或者缩小，当页面足够大，或者足够小时，尺寸会变得很大或者很小，从而导致用户体验差，当然谁会用那么大或者那么小的设备呢大多数情况下，其可以忽略不计的，如果你是一个比较求完美用户体验的人，可通过，对根元素设置比较大比较小值，配加上比较大宽度和比较小宽度

J手写

不能获取的宽度,所以要获取和的宽度，达到兼容

和不是普通元素可以直接获取，可以不用原生获取

加载页面或刷新就调用
();
屏幕变化事件
=(){
();屏幕变化事件也触发事件
}

(){
W=EW;的宽度
W=W;宽度
(W,W);
=W|W;兼容,屏幕宽度
ES=(750*100)+'';100=1
}

源码:
!DOCTYPE
=""

="UTF-8"
-="X-UA-C"="IE="
!--视口标签不允许缩放--
=""="=-,-=10,-=10,-=10,-=0"
D

*{
:0;
:0;
-:05;
}

{
-:;
:75;
:088;
}

{
-:;
:75;
:4;
}

{
-:;
:75;
:088;
}

=""头部
=""主体
=""底部

加载页面或刷新就调用
();
屏幕变化事件
=(){
();屏幕变化事件也触发事件
}

(){
W=EW;的宽度
W=W;宽度
(W,W);
=W|W;兼容,屏幕宽度
ES=(750*100)+'';100=1
}

图例:

使用插件:

-是一款插件，用于将单位转化为

-用于设置基准值,

首步安装组件库
安装命令@--(因为使用的是3所以要安装的针对3的版本@)

第二步对-进行降级

的进阶使用通过----(用来将尺寸转化为尺寸)配置的根元素字体大小安装-安装命令---注意这里会报错C需要8的版本所以这里建议对-进行降级

降级命令-@511--

使用组件库

在中引入组件库

''
A(A)()$('#)

在中导入配置根节点字体大小的方法

'-'

接下来在项目根目录中新建一个写入以下代码

={
:{
-插件的版本需要=500
'-':{
V({}){判断是否是的文件如果是就使用375为根节点字体大小
否则使用75因为使用的设计标准为375但是市场现在的主流设置尺寸是750
O('')!==-1375:75;
},
配置哪些文件中的尺寸需要转化为*表示所有的都要转化
L:['*'],
},
},
};

是一个相对长度单位。其相对于当前对象内文本的字体尺寸。

假如当前没设置行内文本大小，则相对于浏览器的默认字体尺寸。

的值并不是固定的

会继承父级元素的字体大小

、

（VW）、(VH)是基于视图窗口的单位，是3的一部分，基于视图窗口的单位，除了、还有、。

:1等于视口宽度的1%

V:1等于视口高度的1%

缺点:

由于使用、依赖于视图窗口，故当屏幕分辨率变大或者缩小，尺寸会进行相应的放大或者缩小，当页面足够大，或者足够小时，尺寸会变得很大或者很小，从而导致用户体验差，当然谁会用那么大或者那么小的设备呢大多数情况下，其可以忽略不计的，如果你是一个比较求完美用户体验的人，可通过，对根元素设置比较大比较小值，配加上比较大宽度和比较小宽度

转插件

!DOCTYPE
=""

="UTF-8"
=""="=-,-=,-=10,-=10,-=10"
让秀成为一种习惯！！！

{
:100%;
:6;
-:;
-:;
:#;
-:6;+手动转化的，如果转化失败，就是捷键冲突，可以去修改捷键
-:4;
}

=""
123

效果图：

结语：

希望小伙伴永远不会为苦恼，速完美完成工作，早早下班！大屏可视化很好做，就是头皮有点凉，

据bootstrap模板下载行业资深人士表示，其发展还会处于很好的态势。https://www.uihtm.com/bootstrap/HTML源码网(www.uihtm.com)提供div+css3响应式模板包括：网页模板、企业模板、商城模板，以及h5网站,jQuery网页特效,wp主题等8000G源码免费模板下载。