目前,有了css3的rem,给我们的移动端开发带来了前所未有的改变,使得我们的开发更容易,更易兼容很多设备,但这个不在本文讨论的重点中,本文重点说说如何使用js来实时改变网页文字的大小。

代码:

<script>
/* 长宽占位 rem算法, 根据root的rem来计算各元素相对rem, 默认html 320/20 = 16px */
function placeholderPic(){
var w = document.documentElement.offsetWidth;
document.documentElement.style.fontSize=w/20+'px';
}
placeholderPic();
window.onresize=function(){
placeholderPic();
}
</script>

js根据浏览器窗口大小实时改变网页文字大小的更多相关文章

  1. 用javascript动态改变网页文字大小

    <script>function setFontSize(size){document.getElementById('bottom').style.fontsize=size+'pt'; ...

  2. JS 获取浏览器窗口大小

    JS 获取浏览器窗口大小 <script> // 获取窗口宽度 if (windows.innerWidth) { winWidth = windows.innerWidth; } els ...

  3. JS 获取浏览器窗口大小clientWidth、offsetWidth、scrollWidth

    常用: JS 获取浏览器窗口大小   // 获取窗口宽度 if (windows.innerWidth) winWidth = windows.innerWidth; else if ((docume ...

  4. js获取浏览器窗口大小

    摘抄:https://blog.csdn.net/qq_27628085/article/details/81947478 常用: JS 获取浏览器窗口大小       // 获取窗口宽度   if ...

  5. JS获取浏览器窗口大小 获取屏幕,浏览器,网页高度宽度

    网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:document.body.offsetWid ...

  6. js | javascript实现浏览器窗口大小被改变时触发事件的方法

    转载 当浏览器的窗口大小被改变时触发的事件window.onresize 为事件指定代码: 代码如下: window.onresize = function(){ } 例如: 浏览器可见区域信息: 代 ...

  7. JS 获取浏览器窗口大小 获取屏幕,浏览器,网页高度宽度

    网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:document.body.offsetWid ...

  8. 函数语法:JS获取浏览器窗口大小 获取屏幕,浏览器,网页高度宽度(转载)

    网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:document.body.offsetWid ...

  9. javascript实现浏览器窗口大小被改变时触发事件的方法

    转载 当浏览器的窗口大小被改变时触发的事件window.onresize 为事件指定代码: 复制代码代码如下: window.onresize = function(){ } 例如: 浏览器可见区域信 ...

随机推荐

  1. php几个常用的概率算法(抽奖、广告首选)

    做网站类的有时会弄个活动什么的,来让用户参加,既吸引用户注册,又提高网站的用户活跃度.同时参加的用户会获得一定的奖品,有100%中奖的,也有按一定概率中奖的,大的比如中个ipad.iphone5,小的 ...

  2. hibernate 关联映射

    关联关系大致分为两大类: 1.单向关系:只需单向访问关联端.例如:只能通过老师访问学生,或者只能通过学生访问老师. 2.双向关系:关联的两端可以互相访问.例如:老师和学生之间可以互相访问. 单向关联可 ...

  3. codeforce ABBYY Cup 3.0 - Finals (online version) B2. Shave Beaver! 线段树

    B2. Shave Beaver!   The Smart Beaver has recently designed and built an innovative nanotechnologic a ...

  4. loadrunner通过字符串左右边界切割字符串

    void web_reg_save_param_custom(char *sourceStr, char* outpuStr, char *leftBdry, char *rightBdry){    ...

  5. 类中用const限定的成员函数

    本文转自http://blog.csdn.net/whyglinux/article/details/602329 类的成员函数后面加 const,表明这个函数不会对这个类对象的数据成员(准确地说是非 ...

  6. AOP动态代理解析4-jdk代理的实现

    JDKProxy的使用关键是创建自定义的InvocationHandler,而InvocationHandler中包含了需要覆盖的函数getProxy,而当前的方法正是完成了这个操作.在此确认一下JD ...

  7. DSP using MATLAB 示例Example3.1 3.2 3.3

    上代码: w = [0:1:500]*pi/500; % [0,pi] axis divided into 501 points. X = exp(j*w) ./ (exp(j*w) - 0.5*on ...

  8. 如何定义移动端字体Font-Family?

    1.对于IOS 手机系统,默认中文字体是Heiti SC.默认英文字体是Helvetica.默认数字字体是HelveticaNeue.无微软雅黑字体: 2.对于Android 手机系统,默认中文字体是 ...

  9. CSS3属性

    1.边框阴影(box-shadow ): 投影方式,X轴偏移,Y轴偏移,阴影模糊半径,阴影扩展半径,颜色 2.边框图像(border-image) 3.边框圆角:border-radius:5px 4 ...

  10. Regionals 2012 :: Chengdu

    题目连接 排行榜 A和I都是签到题 按位BFS K Yet Another Multiple Problem 题意:给一些可以用的数字,求最小的数,它由特定的数字组成且是n的倍数 分析:暴力枚举不可行 ...