320px宽的设计图

@media screen and (min-width: 320px) {
html {
font-size: 100px;
}
} @media screen and (min-width: 360px) {
html {
font-size: 112.5px;
}
} @media screen and (min-width: 400px) {
html {
font-size: 125px;
}
} @media screen and (min-width: 440px) {
html {
font-size: 137.5px;
}
} @media screen and (min-width: 480px) {
html {
font-size: 150px;
}
} @media screen and (min-width: 640px) {
html {
font-size: 200px;
}
} html {
font-size: 31.25vw;
}

640宽的设计图

@media screen and (min-width:320px){html{font-size:50px;}
}
@media screen and (min-width:360px){html{font-size:56px;}
}
@media screen and (min-width:400px){html{font-size:63px;}
}
@media screen and (min-width:440px){html{font-size:69px;}
}
@media screen and (min-width:480px){html{font-size:75px;}
}
@media screen and (min-width:640px){html{font-size:100px;}
}
html{font-size:-webkit-calc(100vw/6.4);font-size:calc(100vw/6.4);}

1080宽【莫名其妙的尺寸】

@media screen and (min-width: 320px) {
html {
font-size: 30px;
}
} @media screen and (min-width: 360px) {
html {
font-size: 33px;
}
} @media screen and (min-width: 400px) {
html {
font-size: 37px;
}
} @media screen and (min-width: 440px) {
html {
font-size: 41px;
}
} @media screen and (min-width: 480px) {
html {
font-size: 44px;
}
}
html {
font-size: -webkit-calc(100vw/10.8);
font-size: calc(100vw/10.8);
} @media screen and (min-width: 640px) {
html {
font-size: 60px;
}
}

1920px

@media screen and (min-width:320px){html{font-size:16px;}
}
@media screen and (min-width:360px){html{font-size:18px;}
}
@media screen and (min-width:400px){html{font-size:20px;}
}
@media screen and (min-width:440px){html{font-size:22px;}
}
@media screen and (min-width:480px){html{font-size:25px;}
}
@media screen and (min-width:640px){html{font-size:33px;}
}
html{font-size:-webkit-calc(100vw/19.2);font-size:calc(100vw/19.2);}

不同尺寸设计图 rem 断点数据记录的更多相关文章

  1. TDiocpCoderTcpServer返回数据记录有条数限制的问题

    TDiocpCoderTcpServer返回数据记录有条数限制的问题 在使用TDiocpCoderTcpServer控件返回查询数据的时候,发现当记录条数超过一定数量的时候(比方有人反试图返回30万条 ...

  2. MySQL单表百万数据记录分页性能优化

    背景: 自己的一个网站,由于单表的数据记录高达了一百万条,造成数据访问很慢,Google分析的后台经常报告超时,尤其是页码大的页面更是慢的不行. 测试环境: 先让我们熟悉下基本的sql语句,来查看下我 ...

  3. SQL Server 存储(2/8):理解数据记录结构

    在SQL Server :理解数据页结构我们提到每条记录都有7 bytes的系统行开销,那这个7 bytes行开销到底是一个什么样的结构,我们一起来看下. 数据记录存储我们具体的数据,换句话说,它存在 ...

  4. MySQL 单表百万数据记录分页性能优化

    文章转载自:http://www.cnblogs.com/lyroge/p/3837886.html 背景: 自己的一个网站,由于单表的数据记录高达了一百万条,造成数据访问很慢,Google分析的后台 ...

  5. CSS3新的字体尺寸单位rem

    CSS3引入新的字体尺寸单位 rem ,可以简单记忆为root rm. CSS3的出现,他同时引进了一些新的单位,包括我们今天所说的rem.在W3C官网上 是这样描述rem的——“font size ...

  6. (转)ThinkPHP find方法 查询一条数据记录

    find() ThinkPHP find() 方法是和 select() 用法类似的一个方法,不同之处 find() 查询出来的始终只有一条数据,即系统自动加上了 LIMIT 1 限制. 当确认查询的 ...

  7. MySQL查询数据表中数据记录(包括多表查询)

    MySQL查询数据表中数据记录(包括多表查询) 在MySQL中创建数据库的目的是为了使用其中的数据. 使用select查询语句可以从数据库中把数据查询出来. select语句的语法格式如下: sele ...

  8. 清理8组nodes中表的历史数据,平均每个node中的表有1.5亿条记录,需要根据date_created字段清理8000W数据记录,这个字段没有索引。

    清理8组nodes中表的历史数据,平均每个node中的表有1.5亿条记录,需要根据date_created字段清理8000W数据记录,这个字段没有索引. 环境介绍  线上磁盘空间不足,truncate ...

  9. SQL Server :理解数据记录结构

    原文:SQL Server :理解数据记录结构 在SQL Server :理解数据页结构我们提到每条记录都有7 bytes的系统行开销,那这个7 bytes行开销到底是一个什么样的结构,我们一起来看下 ...

随机推荐

  1. iOS逆向系列-逆向APP思路

    界面分析 通过Cycript.Reveal. 对于Reveal安装配置可参考配置iOS逆向系列-Reveal 通过Reveal找到内存中的UI对象 静态分析 开发者编写的所有代码最终编译链接到Mach ...

  2. Ubuntu环境下使用npm编译从git上clone下来的前端(Javascript)项目

    一.更新Ubuntu软件源 打开终端依次输入: $ sudo apt-get update $ sudo apt-get install -y python-software-properties s ...

  3. 警告(alert 消息对话框) 如果你不点击“确定”,就不能对网页做任何操作,这个小窗口就是使用alert实现的

    警告(alert 消息对话框) 我们在访问网站的时候,有时会突然弹出一个小窗口,上面写着一段提示信息文字.如果你不点击"确定",就不能对网页做任何操作,这个小窗口就是使用alert ...

  4. T3118 01完美矩阵【计数,前缀和,差分,好题】

    Online Judge:未知 Label:好题,计数,前缀和 题目描述 一个01矩形被称为是完美01矩形,如果满足下面3个条件: (1)它的四条边上都是1 (2)内部(除了4条边)的0和1的个数之差 ...

  5. array_map、array_walk、array_filter三个函数的区别

    array_walk --- 使自定的函数能处理数组的每个元素 bool array_walk ( array &array, callback funcname [, mixed userd ...

  6. html--图片背景兼容,兼容IE6

    在IE6中对图片格式png24支持度不高, 如果使用的图片格式是png24,则会导致透明效果无法正常显示 解决方法: 1.可以使用png8来代替png24,即可解决问题, 但是使用png8代替png2 ...

  7. [JZOJ3296] 【SDOI2013】刺客信条

    题目 题目大意 给你一棵树,树上每个节点有000或111的状态. 用最少的操作次数使得当前状态与目标状态同构. 思考历程 首先想到的是找重心. 因为根是不确定的,但重心只会有一个或两个,以重心为根就能 ...

  8. 廖雪峰Java12maven基础-1maven入门-3构建流程

    maven是一个Java项目管理和构建工具: 标准化项目结构 标准化构建流程(编译.打包.发布) 依赖管理 Maven的构建流程 clean 删除所有编译生成的文件 compile 编译源码.编译测试 ...

  9. springboot下slf4j配置

    我们在引用的时候直接写 private static final Logger logger = LoggerFactory.getLogger(XXXServiceImpl.class); log. ...

  10. zabbix自动发现主机(转)

    zabbix自动发现主机 2018年06月15日 18:02:52 loyal-Wang 阅读数:817更多 个人分类: zabbix   版权声明:本文为博主原创文章,转载请注明出处. https: ...