cssrem 比例适配理解
cssrem只是帮你自动计算,省去了你在切图时,从设计稿拿到的px再根据比例转换成rem的中间过程。
- 这个40我无法猜测, 以前设计稿给的都是按640px(iphone5s的宽)来的,我们就按照这个比例640px切分成20等分的话,一份就是640/20 = 32px, 也就是1 rem = 32px; (这里把40换成32),另外这个32px就是要你在html里设置的font-size大小了。
- 按第一点所说,如果你的比例就用40,那明显你就要在html的font-size里设置40px了
假如你要设置font-size = 20px 那就是你要把比例改成20啦,表示 1rem = 20px
如果你设置的比例是1rem = 10px
设计图上的放大2倍,应设置比例是20
cssrem 比例适配理解的更多相关文章
- 等比例适配所有屏幕---css3 rem用法
1,rem的定义 rem(font size of the root element)是指相对于根元素的字体大小的单位.rem是一个相对单位.和em非常相似.em(font size of the e ...
- 第十六篇、OC_按比例适配
// 屏幕高度 #define XMGHeight [UIScreen mainScreen].bounds.size.height // 屏幕宽度 #define XMGWidth [UIScree ...
- iOS XIB等比例适配
选择两个视图使其等宽高,再去约束里面就可以设置乘数因子. 简单的一个例子: 要求:设置白色视图的宽度为蓝色视图的一半 1.点击白色视图连线到父视图,选择 Equal Widths 2.选择右边 ...
- 关于iPhone设备不同显示尺寸适配的一些方法
关于iPhone设备不同显示尺寸适配的一些方法 ------关于适配的理解------ 1.什么是适配? 适配是对不同硬件和系统软件的适应,硬件包括屏幕显示,处理器,内存等等(目前主要是屏幕适配, ...
- webApp 页面适配布局
webApp 页面布局 1. 流式布局 概念: 流式布局是页面元素宽度按照屏幕分辨率进行适配调整,但是整体布局不变. 设计方法: 布局都是通过百分比来定义宽度,但是高度大都是用px固定的. 弊端: 虽 ...
- Android-屏幕适配经验总结
本文记录一些适配问题的研究,基础概念不做过多介绍. Android在做屏幕适配的时候一般考虑两个因素:分辨率和dpi.分辨率是屏幕在横向.纵向上的像素点数总和,一般用"宽x高"的形 ...
- 关于iOS适配问题
大家都知道在iOS开发当中对于UI适配问题可以从如下两个方面去考虑: 1.比例适配 2.利用autolayout自动布局 通常情况来说,利用auto自动布局是一个比较好的方案,开发者可以利用story ...
- 移动端web页面如何适配
移动端web页面如何适配,现有两个方案: 1 设置viewport进行缩放 简单粗暴,使用过程中反应缩放会导致有些页面元素会糊的情况.天猫的web app的首页使用这种方案 在页面中加入viewpor ...
- web app变革之rem(手机屏幕实现全适配)
以往web移动适配,常规写法是:media only screen @media only screen and (min-device-width: 320px){ //针对iPhone 3 } @ ...
随机推荐
- mysql utf8字符集下使用DES_ENCRYPT
DES_ENCRYPT() 加密字符串后内容为空 改变字符集latin1 可以保存和解密(DES_DECRYPT)
- Design Pattern – Proxy, Adapter, Facade, Mediator
这几个模式比较类似, 都是用作interface, 但有所不同 Proxy, 特点是以假乱真, client在使用的时候就和在使用真正的object一样, 接口完全一致, proxy和object的交 ...
- Kafka — 高吞吐量的分布式发布订阅消息系统【转】
1.Kafka独特设计在什么地方?2.Kafka如何搭建及创建topic.发送消息.消费消息?3.如何书写Kafka程序?4.数据传输的事务定义有哪三种?5.Kafka判断一个节点是否活着有哪两个条件 ...
- Python高级教程-切片
Python中的切片 取一个list或tuple的部分元素是非常常见的操作.比如,一个list如下: >>> L = ['A','B','C','D'] 对经常取指定索引范围的操作, ...
- tomcat 介绍
Tomcat简介 Tomcat是Apache软件基金会(Apache Software Foundation)的Jakarta 项目中的一个核心项目,由Apache.Sun和其他一些公司及个人共同开发 ...
- 005-jdk安装卸载
一.yum安装 1.查看CentOS自带JDK是否已安装. yum list installed |grep java 2.若有自带安装的JDK,卸载CentOS系统自带Java环境 卸载JDK相关文 ...
- 用Kotlin开发Android的Hello Kotlin!!
1 创建新项目 android studio 新建一个项目 只有一个空MainActivity 2 安装kotlin file-seeting-plugins-install jetbrains pl ...
- android studio本地gradle
1.从网站上下载http://services.gradle.org/distributions/ 2.打开工程里的gradle-wrapper.properties, distributionUrl ...
- Delphi 正则表达式之TPerlRegEx 类的属性与方法(5): Compile、Study
Delphi 正则表达式之TPerlRegEx 类的属性与方法(5): Compile.Study // Compile.Study var reg: TPerlRegEx; begin re ...
- java项目地址和服务器地址区分
项目地址String filePath = request.getSession().getServletContext().getRealPath("/") + "up ...