❶ HTML5如何利用rem实现自适应布局
分析设计图
假设设计图大小为1080px。这也就意味着，在开发时，需要兼容的最大分辨率为1080px，最小的为320px。
2.调整视口
代码实例：
<!DOCTYPEhtml>
<head>
<metacharset="UTF-8"/>
<title>布局之路-移动端开发实例</title>
<metaname="viewport"content="width=device-width,user-scalable=no"/>
<linkrel="stylesheet"type="text/css"href="css/reset.css"/>
</head>
<body>
<divclass="wrap"></div>
</body>
</html>
代码解析：由于使用不同设备打开网页时，宽度均有所不同，所以不能讲视口设置为固定值，应当为width=device-width,即将视口设置为当前设备的宽度。
3. 确定设计图的最小字体
浏览器（部分）能够显示的最小字体未12px，当移动端页面宽度为320px时，要保证最小字体为12px，那么在1080px的设计图中，最小字体应当为42px。
代码实例：
<styletype="text/css">
html{
font-size:42px;
}
</style>
4. 按照设计图的像素进行开发
按照正常网页开发流程，进行网页开发即可。
5. 使用百分比和rem替换px
代码效果对比：
/*使用固定像素*/
.box{
float:left;
width:658px;
font-size:72px;
text-align:center;
line-height:195px;
}
/*使用百分比和rem*/
.box{
float:left;
width:60.93%;
font-size:1.71rem;
text-align:center;
line-height:4.64rem;
}
代码解析：
水平方向的值，将具体像素调整为百分比。百分比的计算是根据父级的内容区宽度进行计算的。
例如，父级宽度为1080px， 子级元素为197px，那么子元素转换为百分比为：197/1080*100%=18.24%。需要注意的是百分比根据父级计算，当标签结构级别不同时，计算公式中的“分母”也有所不同，在开发时这个地方很容易出现问题，请务必注意。
垂直方向的值，将具体像素调整为rem，与水平方向相比，垂直方向的计算就比较简单。例如，行高为195px，HTML标签当前的字体大小为42px，将行高转换为rem单位，即195/42= 4. 64rem。
❷ 移动端web开发 rem要怎么用
1、rem介绍
rem（font size of the root element）是指相对于根元素（即html元素）的字体大小的单位。
假设根元素的字体大小是10px, 则5rem的大小为5*10=50px,例如
❸ 前端开发 如何解决Chrome浏览器1rem=10PX的方法
rem是以html标签font-size定义rem的宽度
html{
font-size:62.5%
}然后就可以了
❹ 前端移动端rem页面怎么写js代码怎么写
首先rem是根据--根节点的字体大小控制rem的大小。
先按照设计图的尺寸用px单位把整个页面写出来.....然后网上找px转换rem的工具，也可以自己算。。最后就是设置html的font-size了..这个要用px来做单位...这样就可以控制单位为rem的大小了。。（控制html的字体大小可以用@media根据不同的屏幕来设置，，也可以用js获取屏幕宽度或高度来计算。。然后设定字体大小）...2017-08-17 9.54
❺ 前端代码中的rem是什么意思
rem单位以根元素的字体大小为基准
和em（font size of the element）的区别是，em是根据其父元素的字体大小来设置，而rem是根据网页的跟元素（html）来设置字体大小的
❻ css样式中的rem是什么意思啊，1.2rem
CSS3新增的一个相对单位rem（root em，根em）。
rem是相对于根节点（或者是html节点）。
如果根节点设置了font-size:10px;
那么font-size:1.2rem;字体大小等于12px;
❼ 前端开发中px，em，rem这些单位有哪些不同之处
Px是一个绝对字体大小，em则是基于基数（比如：1.5em）来计算出来的相对字体大小。这个基数是需要乘以当前对象从其父级遗传字体大小。
目前大多数浏览器都支持rem单位的字体大小，不过，要想兼容IE7和IE8，你还是需要使用px来做单位。
这个默认字体大小是依据你网站当前访问时所使用的浏览器或者其他设备来决定的，对于桌面浏览器默认是16px的字体大小。然后你现在要转换当前元素的字体大小为rem的时候你就可以这样做
❽ css Pc端如何定义rem
rem相对于根元素的font-size值来计算具体长度。不同分辨率下实现rem值的长度的变化，需要使用@mediascreen实现根元素的font-size值变化即可。
❾ 前端移动端页面怎么用rem布局
!new function(){var a=this;a.width=750,a.fontSize=100,a.widthProportion=function(){var b=(document.body&&document.body.clientWidth||document.getElementsByTagName("html")[0].offsetWidth)/a.width;return b>1?1:b},a.changePage=function(){document.getElementsByTagName("html")[0].setAttribute("style","font-size:"+a.widthProportion()*a.fontSize+"px !important")},a.changePage(),window.addEventListener("resize",function(){a.changePage()},!1)};
引入这段js代码，设计图的750px = 7.5rem ，同理10px = 0.1rem
记得在css设置默认字体大小 body{font-size: 0.3rem;}
举例：.div1{width: 7.5rem;height: 1rem;}
❿ CSS里面，rem是什么单位
rem是一个相对单位，相对根元素字体大小的单位。我们只需要指定根元素为参考值，就可以了。主要用于屏幕适配布局，移动端使用比较广泛。使用这种方式，只要根据不同屏幕设置不同的根元素即可使系统适配不同的屏幕。
希望可以帮到你