码迷,mamicode.com
首页 > 移动开发 > 详细

rem 移动端栅格化 适配

时间:2016-06-26 16:34:43      阅读:814      评论:0      收藏:0      [点我收藏+]

标签:

1.rem

rem (font size of the root element)是指相对于根元素<html>字体大小的单位。

<html>
    <head>
         <style type="text/css">
              html{
                  font-size: 20px;
              }
            div{
                  width: 100rem;
                  height: 60rem;
            }
         </style>
     </head>
    <body>
        <!--div宽度为:100 * 20px =200px;高度为60 * 20px = 120px-->
         <div></div>
    </body>
</html>

2.移动端栅格化

(1)把不同大小的移动端屏幕的宽度划分为相同个数的片段,这个片段的长度就是栅格的高度和宽度。假设横向的栅格数为16:若屏幕的宽度为320px,则每个栅格的宽度和高度为20px;若屏幕的宽度为240px,则每个栅格的的宽度和高度为15px。不同屏幕横向的栅格数相同,格子的大小随屏幕的大小而改变,一个元素的宽度与高度占有固定个数的格子。

rem 移动端栅格化 适配

标签:

原文地址:http://www.cnblogs.com/fe-huahai/p/5617956.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!