本文主要是介绍使用rem单位制，实现页面适应性窗口元素，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
目录
REM单位：
媒体查询：
引入资源：
REM适配方案：
适配方案一： rem+媒体查询+less技术
适配方案二：
REM单位：
rem(rootem)是一个相对单位，类似于em,em是父元素字体大小。
不同的是rem的基准是相对于html元素的字体大小。
比如，根元素（html)设置font-size-12px:非根元素设置width2rem;则换成px表示就是24px.
REM是针对于html的文字大小。
借此主要是为了结合媒体查询能够实现，当窗口大小发生改变的时候，字体，元素的大小也会发生改变。
媒体查询：
媒体查询（mediaquery)是css3新语法。
使用 @media查询，可以针对不同的媒体类型定义不同的样
@media可以针对不同的屏幕尺寸设置不同的样式
当你重置浏览器大小的过程中，页面也会根据浏览器的宽度和高度重新渲染页面
目前针对很多苹果手机，android手机，平板等设备都用得到多媒体查询
这样就可以实现随着视窗口的改变实现字体大小等的一键改变了。
在视窗口的大小在500到800之间的时候背景展示为粉色。
在视窗口的大小小于500的时候背景展示为紫色。
这两个表示两个他们之间不会冲突。
---
此外，下图便是，表示在一个范围内的变化。
引入资源：
当样式比较繁多的时候，我们可以针对不同的媒体使用不同stylesheets(样式表）.
原理，就是直接在link中判断设备的尺寸，然后引用不同的css文件。
REM适配方案：
适配方案一： rem+媒体查询+less技术
less使用时的特殊用法:
适配方案二：
这篇关于使用rem单位制，实现页面适应性窗口元素的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
