移动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 ...
随机推荐
- calc() 计算CSS属性值
calc()是css3的一个新增的功能,用来指定元素的长度.比如说,你可以使用calc()给元素的border.margin.pading.font-size和width等属性设置动态值.calc() ...
- 一键修改android 字体和图片大小.
项目中需要动态更改 app的字体和图片, 在查阅中找到的更改主题的解决办法,和单独的修改字体的方法. 这两种方法的确有效果但是实现麻烦,在修改字体的过程中,找到一个额外的方法, 修改字体的实现更改 ...
- js单线程和js异步操作的几种方法
一.为什么JavaScript是单线程? JavaScript语言的一大特点就是单线程,也就是说,同一个时间只能做一件事. JavaScript的单线程,与它的用途有关.作为浏览器脚本语言,JavaS ...
- IntelliJ IDEA openfire 使用IntelliJ IDEA 部署OPENFIRE 服务端
用MyEclipse部署OF的步骤,网上有很多,可以自行google,这里要记录的是用据说最好用的JAVA编辑器IntelliJ IDEA来部署OF服务端.试了好多下,终于成功了,记录下. 直接上图吧 ...
- MongoDB最简单的入门教程之四:使用Spring Boot操作MongoDB
Spring Boot 是一个轻量级框架,可以完成基于 Spring 的应用程序的大部分配置工作.Spring Boot的目的是提供一组工具,以便快速构建容易配置的Spring应用程序,省去大量传统S ...
- du - 报告磁盘空间使用情况
总览 du [options] [file...] POSIX 选项: [-askx] GNU 选项 (最短格式): [-abcDhHklLmsSxX] [--block-size=size] [-- ...
- import downloadjs from 'downloadjs' 如果是自己写的函数 没用默认导出 记得加花括号 例如 import { download } from './data.js'
import downloadjs from 'downloadjs' 如果是自己写的函数 没用默认导出 记得加花括号 例如 import { download } from './data.js'
- CentOS7.6 修改密码
一.重启系统,在开机过程中,按下键盘上的e,进入编辑模式 三.将光标一直移动到 LANG=en_US.UTF-8 后面,空格,再追加init=/bin/sh.这里特别注意,需要写在UTF-8后,保 ...
- Sqlserver查询结果集插入新表
数据库“Test” 数据库“Test2” 表 “fromTable” 表 “toTable” 表 “newTable” 字段 “name”,“age”,“gender” 原因:公司有2个数据库,一个是 ...
- swift详解之九---------------自动引用计数、循环引用
自动引用计数.循环引用(这个必须理解,必须看) 注:本文详细介绍自动引用计数,以及各种循环引用问题.一网打尽! 1. 自动引用计数原理 Swift 使用ARC机制来跟踪和管理你的内存,一般情况下,Sw ...