移动web页面字体大小三
<script type="text/javascript">
(function (doc, win) {
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function () {
var clientWidth = docEl.clientWidth;
if (!clientWidth) return;
docEl.style.fontSize = 64 * (clientWidth / 640) + 'px';
};
if (!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);
</script>
其中docEl.style.fontSize = 64 * (clientWidth / 640) + 'px'; 中64是html中设置的font-size,640是psd中图像宽,也就说如果PSD设计750px,那么这边就是75px。你可以试一下,最后html生效的字体大小和http://m.taobao.com 上的html上的字体大小是一样的。
PS:第一位回答问题的仁兄,用了下你的代码。
移动web页面字体大小三的更多相关文章
- 移动web页面字体大小二
按设计稿中的字体大小设置页面字体大小(px),在手机端,因为不同设备会有不同,换算成rem单位.rem是“font size of the root element”,可以通过这篇文章了解http:/ ...
- RabbitMQ的web页面介绍(三)
一.Virtual Hosts 每一个 RabbitMQ 服务器都能创建虚拟的消息服务器,我们称之为虚拟主机 (virtual host) ,简称为vhost.每一个 vhost 本质上是一个独立的小 ...
- vue+sass实现切换字体大小
接到领导指示,用户嫌我做的页面字体太小,15px的字体叫小?领导说用户多是上了年纪的人.没办法,改吧,谁让咱是个搬砖的呢..咳咳 我寻思着这次改大了,下次用户嫌大再让改小呢?干脆给他做个选择字号的功能 ...
- HTML5移动Web开发(八)——避免文本字体大小重置
适用设备:iOS.Windows Mobile在一些移动设备上,比方说iPhone,Windows Mobile,当用户把手机切换到横屏时,浏览器会自动地重置文本字体大小.这可能会对我们造成困扰,因为 ...
- [转]移动端web页面使用字体的思考
一直不知道手机端用的什么字体,只是觉得类似雅黑,直到有一次设计师问到设计移动web页面该用什么字体才严肃地想起这个问题. 前人已栽树,后人我就直接转来吧…… 回想2年前刚开始接触手机项目,接到PSD稿 ...
- 打印web页面指定区域的三种方法
本文和大家分享一下web页面实现指定区域打印功能的三种方法,一起来看下吧. 第一种方法:使用CSS 定义一 个.noprint的class,将不打印的内容放入这个class内. 代码如下: <s ...
- 在前端页面中使用@font-face来显示web自定义字体【转】
本文转自W3CPLUS 的<CSS @font-face> @font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中,随着@font-face模块的出现, ...
- 移动端rem布局,用户调整手机字体大小或浏览器字体大小后导致页面布局出错问题
一.用户修改手机字体设置大小,影响App里打开的web页面. 手机字体设置大小,影响App的页面.Android的可以通过webview配置webview.getSettings().setTextZ ...
- eclipse环境配置,字体大小,代码智能提示,JSP页面默认字符集修改
安装好JDK后,下载Java EE解压版eclipse 1.字体大小 Windows——>Preferences——>General——>Appearance——>Colors ...
随机推荐
- iOS --- 搜索框UISearchController的使用(iOS8.0以后替代UISearchBar+display)
在iOS 8.0以上版本中, 我们可以使用UISearchController来非常方便地在UITableView中添加搜索框. 而在之前版本中, 我们还是必须使用UISearchBar + UISe ...
- Centos 6 安装python2.7.6
centos 是自带python的.但是版本稍微旧一些.搞python开发,肯定要用新一点的稳定版.所以,要升级一下python. 先去python主站下载python的源码包:Python-2.7. ...
- Promise 理解与使用
个人觉得这篇博客写的非常详细且易懂,推荐给小伙伴们~ https://www.cnblogs.com/lvdabao/p/es6-promise-1.html#!comments
- PHP13 会话控制
学习要点 会话控制使用的意义 用户跟踪方式 Cookie的设置.读取以及删除 Session的设置.读取以及删除 自定义session处理方式 会话控制 什么是会话控制 实现服务器跟踪同一个客户端的连 ...
- 谈谈你对java的理解
这个题目是考察多个方面 但是要回答出关键点: 1.平台无关性 2.GC 3.语言特性.泛型.反射.lamda 4.面向对象 5.类库 6.异常处理
- springmvc @RequestParam @RequestBody @PathVariable 等参数绑定注解详解
简介: handler method 参数绑定常用的注解,我们根据他们处理的Request的不同内容部分分为四类:(主要讲解常用类型) A.处理requet uri 部分(这里指uri templat ...
- InnoDB体系架构总结(一)
缓冲池: 是一块内存区域,通过内存的速度来弥补磁盘速度较慢对数据库性能的影响.在数据库中读取的页数据会存放到缓冲池中,下次再读取相同页的时候,会首先判断该页是否在缓冲池中.对于数据库中页的修改操 ...
- 关于linux安装kettle的总结
一.部署准备 1.1 JDK安装配置 命令行键入“cd /etc”进入etc目录 命令行键入“vi profile”打开profile文件 敲击键盘ctrl+F到文件末尾 在末尾处,即第一个~的地方, ...
- SCI journals on Energy
SCI journals on Energy Table of Contents 1. SCI- Clarivate - Thomson Reuters 1 SCI- Clarivate - Thom ...
- 【BZOJ 3289】 Mato的文件管理(离线算法莫队)
Description Mato同学从各路神犇以各种方式(你们懂的)收集了许多资料,这些资料一共有n份,每份有一个大小和一个编号.为了防止他人偷拷,这些资料都是加密过的,只能用Mato自己写的程序才能 ...