cssrem只是帮你自动计算,省去了你在切图时,从设计稿拿到的px再根据比例转换成rem的中间过程。

  1. 这个40我无法猜测, 以前设计稿给的都是按640px(iphone5s的宽)来的,我们就按照这个比例640px切分成20等分的话,一份就是640/20 = 32px, 也就是1 rem = 32px; (这里把40换成32),另外这个32px就是要你在html里设置的font-size大小了。
  2. 按第一点所说,如果你的比例就用40,那明显你就要在html的font-size里设置40px了

假如你要设置font-size = 20px 那就是你要把比例改成20啦,表示 1rem = 20px

如果你设置的比例是1rem = 10px

设计图上的放大2倍,应设置比例是20

cssrem 比例适配理解的更多相关文章

  1. 等比例适配所有屏幕---css3 rem用法

    1,rem的定义 rem(font size of the root element)是指相对于根元素的字体大小的单位.rem是一个相对单位.和em非常相似.em(font size of the e ...

  2. 第十六篇、OC_按比例适配

    // 屏幕高度 #define XMGHeight [UIScreen mainScreen].bounds.size.height // 屏幕宽度 #define XMGWidth [UIScree ...

  3. iOS XIB等比例适配

    选择两个视图使其等宽高,再去约束里面就可以设置乘数因子. 简单的一个例子: 要求:设置白色视图的宽度为蓝色视图的一半 1.点击白色视图连线到父视图,选择 Equal Widths     2.选择右边 ...

  4. 关于iPhone设备不同显示尺寸适配的一些方法

    关于iPhone设备不同显示尺寸适配的一些方法   ------关于适配的理解------ 1.什么是适配? 适配是对不同硬件和系统软件的适应,硬件包括屏幕显示,处理器,内存等等(目前主要是屏幕适配, ...

  5. webApp 页面适配布局

    webApp 页面布局 1. 流式布局 概念: 流式布局是页面元素宽度按照屏幕分辨率进行适配调整,但是整体布局不变. 设计方法: 布局都是通过百分比来定义宽度,但是高度大都是用px固定的. 弊端: 虽 ...

  6. Android-屏幕适配经验总结

    本文记录一些适配问题的研究,基础概念不做过多介绍. Android在做屏幕适配的时候一般考虑两个因素:分辨率和dpi.分辨率是屏幕在横向.纵向上的像素点数总和,一般用"宽x高"的形 ...

  7. 关于iOS适配问题

    大家都知道在iOS开发当中对于UI适配问题可以从如下两个方面去考虑: 1.比例适配 2.利用autolayout自动布局 通常情况来说,利用auto自动布局是一个比较好的方案,开发者可以利用story ...

  8. 移动端web页面如何适配

    移动端web页面如何适配,现有两个方案: 1 设置viewport进行缩放 简单粗暴,使用过程中反应缩放会导致有些页面元素会糊的情况.天猫的web app的首页使用这种方案 在页面中加入viewpor ...

  9. web app变革之rem(手机屏幕实现全适配)

    以往web移动适配,常规写法是:media only screen @media only screen and (min-device-width: 320px){ //针对iPhone 3 } @ ...

随机推荐

  1. Spring 框架的核心功能之AOP技术

    1. AOP 的概述 AOP, Aspect Oriented Programming, 面向切面编程; 通过预编译方式和运行期动态代理实现程序功能的统一维护的技术; AOP 采取横向抽取机制,取代了 ...

  2. php smarty模板引擎

    <?php /* 一.什么是smarty? smarty是一个使用PHP写出来的模板PHP模板引擎,它提供了逻辑与外在内容的分离,简单的讲, 目的就是要使用PHP程序员同美工分离,使用的程序员改 ...

  3. 洛谷 P2331 [SCOI2005]最大子矩阵

    洛谷 这一题,乍一眼看上去只想到了最暴力的暴力--大概\(n^4\)吧. 仔细看看数据范围,发现\(1 \leq m \leq 2\),这就好办了,分两类讨论. 我先打了\(m=1\)的情况,拿了30 ...

  4. 报错:SyntaxError: (unicode error) 'unicodeescape' codec can't decode bytes in position 2-3: truncated \UXXXXXXXX escape

    Outline SyntaxError: (unicode error) 'unicodeescape' codec can't decode bytes in position 2-3: trunc ...

  5. Redis的慢查询日志

    编辑配置文件/etc/redis.conf针对慢查询日志,可以设置两个参数,一个是执行时长,单位是毫秒,另一个是慢查询日志的长度.当一个新的命令被写入日志是,最老的一条会从命令日志队列中被移除slow ...

  6. Linux基础整理 + 注释

    1.Linux的常用命令: ls 显示当前文件夹目录 ll -->详细信息 ls -a 显示所有文件 ls -lhSr w 查看登录的帐号,还可以查看cpu负载情况,who am i ,who ...

  7. 简明python教程七----面向对象的编程(下)

    继承:类之间的类型和子类型关系 代码重用:SchoolMember类被称为 基本类或超类,而Teacher和Student类被称为导出类或者子类 #!/usr/bin/python #Filename ...

  8. 线性表 - C语言完整实现

    #include <stdio.h> #define false 0 #define true 1 #define MAXSIZE 20 typedef int bool; typedef ...

  9. Git学习笔记-精简版

    注意本文参考廖雪博客: http://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000 一:Git ...

  10. list comprehension & generator expression

    List comprehensions(列表推导式) are better when you want to iterate over something multiple times. Howeve ...