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. StringUtils工具

    ppublic class StringUtils { private StringUtils() { } /** * 文本左边补零 * * @param maxLength 文本长度 * @para ...

  2. python 递归计算若干工作日后的日期

    import datetime # 根据第一次计算出来的休息日数,计算还需要的工作日数.(递归调用) def get_next_date(self, start_date, weekend_days) ...

  3. 廖雪峰Java13网络编程-2Email编程-2接收Email

    1接收Email协议类型 接收Email:收件人通过MUA软件把邮件从MDA抓取到本地计算机的过程. 1.1 POP3 从MUA到MDA使用最广泛的是协议是POP3 Post Office Proto ...

  4. 廖雪峰Java11多线程编程-3高级concurrent包-6ExecutorService

    Java语言内置多线程支持: 创建线程需要操作系统资源(线程资源,栈空间) 频繁创建和销毁线程需要消耗大量时间 如果可以复用一个线程 线程池: 线程池维护若干个线程,处于等待状态 如果有新任务,就分配 ...

  5. 在vc2008 mfcC++中使用sqlite的示例

    http://owlman.org/?p=890 在C++中使用sqlite的示例 2011年8月5日admin发表评论阅读评论 最近因为工作原因,终于使我有机会腾出时间来接触了一下SQLite数据库 ...

  6. VS2010-MFC(对话框:非模态对话框的创建及显示)

    转自:http://www.jizhuomi.com/software/162.html 前面已经说过,非模态对话框显示后,程序其他窗口仍能正常运行,可以响应用户输入,还可以相互切换.本节会将上一讲中 ...

  7. SpringCloud学习笔记(一):SpringCloudt相关面试题

    什么是微服务? 看笔记二 微服务之间是如何独立通讯的? 服务与服务间采⽤轻量级的通信机制互相协作(通常是基于HTTP协议的RESTful API) SpringCloud和Dubbo有什么区别? Du ...

  8. <随便写>创建文件批处理文件

    创建一个text文档 写入想写的程序 将后缀改为bat 例如创建一个文件夹: 双击运行bat文件就可以创建文件夹 运行结果: 需要批量处理,就用for循环生成代码,粘贴上去就行了

  9. ASP.NET MVC生命周期与管道模型

      先来熟悉下asp.net请求管道 1.当客户端发送http://localhost:80/home/index请求时 2.首先到达服务端的内核模块HTTP.SYS(它监听80端口),通过访问注册表 ...

  10. Chapter 4 图

    Chapter 4 图 . 1-   图的存储结构 无向图:对称 有向图:…… 2-   图的遍历 1   深度优先搜索(DFS) 类似于二叉树的先序遍历 2   广度优先搜索(BFS) 类似于二叉树 ...