JS根据设备宽度设置根节点(html)font-size字体大小

(function () {

document.addEventListener(‘DOMContentLoaded‘, function () {

var deviceWidth = document.documentElement.clientWidth;

document.documentElement.style.fontSize = deviceWidth / 6.4 + ‘px‘;

}, false);

window.onresize = function(){

var deviceWidth = document.documentElement.clientWidth;

document.documentElement.style.fontSize = deviceWidth / 6.4 + ‘px‘;

};

})();

http://baoxian.pingan.com/pa18shopnst/u/wx/product/bankCardSafe/index.shtml

https://segmentfault.com/a/1190000004189237?_ea=522147

http://caibaojian.com/flexible-js.html

http://caibaojian.com/web-app-rem.html

http://huodong.m.taobao.com/act/yibo.html

http://121.40.99.17/global/rem-phone.html

头部像素

<script type="text/javascript">

var scale = 1.0, ratio = 1, assetsHost = ‘g.tbcdn.cn‘, assetsVersion = ‘0.5.12‘, isTestEnv = false;

(function() {

if (location.host.match(/(waptest|wapa)\.taobao\.com$/i)) {

assetsHost = ‘g.assets.daily.taobao.net‘;

assetsVersion = ‘0.5.12‘;

isTestEnv = true;

}

if (window.devicePixelRatio === 2 && window.navigator.appVersion.match(/iphone/gi)) {

scale = 0.5;

ratio = 2;

}

var text = ‘<meta name="viewport" content="initial-scale=‘ + scale + ‘, maximum-scale=‘ + scale +‘, minimum-scale=‘ + scale + ‘, user-scalable=no" />‘

+ ‘<link‘ + ‘ type="text/css" rel="styleSheet" href="http://‘ + assetsHost + ‘/mtb/app-index/‘ + assetsVersion + ‘/index‘ + ratio + ‘.css"‘ + ‘ />‘;

document.write(text);

})();

</script>

时间: 2024-10-23 05:02:20

JS根据设备宽度设置根节点(html)font-size字体大小的相关文章

ADT开发中的一些优化设置:代码背景色、代码字体大小、代码自动补全

初学Android开发,在网上找到一些ADT工具的优化,自己设置好了,截图保存下来.免得以后忘了. 1. 设置背景颜色: 色调85.饱和度90.亮度205 RGB:199.237.204 2. 设置代码的字体 设置JAVA文件代码的字体: 设置XML文件中代码的字体: 3. 设置自动补全代码 刚刚学Android,有很多变量和方法 都不熟悉.需要有提示,才更加方便. 快捷方式:Alt + /    可以出现代码提示. 默认的只有输入“ .” 以后才会有代码补全提示,可作如下设置: 在Auto a

设置导航栏标题颜色及字体大小

//改变导航栏标题颜色及字体大小 e.g设置字体颜色为red 字体大小为18 self.navigationController.navigationBar.titleTextAttributes = @{NSForegroundColorAttributeName: [UIColor redColor], NSFontAttributeName : [UIFont boldSystemFontOfSize:18]}; //改变导航栏返回按钮颜色 [self.navigationControll

Android设置不被系统设置改变的字体大小

原因 从4.0开始,系统设置中“显示”可以对字体大小进行配置,这会影响到TextView等控件中文字显示的大小. 解决方案 在自定义的Activity中重写getResources方法 @Override public Resources getResources() { Resources res = super.getResources(); Configuration conf = new Configuration(); conf.setToDefaults(); res.updateC

Html字体大小的设置单位PT与PX区别

Html字体大小的设置单位PT与PX区别  字体大小的设置单位,常用的有2种:px.pt. 基本概念: px:pixel,像素,屏幕上显示的最小单位,用于网页设计,直观方便: pt:point,是一个标准的长度单位,1pt=1/72英寸,用于印刷业,非常简单易用: em:即%,在CSS中,1em=100%,是一个比率,结合CSS继承关系使用,具有灵活性. PPI(DPI):pixel(dot)per inch,每英寸的像素(点)数,是一个率,表示了“清晰度”,“精度” PX和PT转换的公式: p

设置根字体的js代码

移动端会经常涉及到用rem来布局,所以设置根字体很重要.下面是设置根字体的js代码,仅供参考! 1 (function (doc, win) { 2 var docEl = doc.documentElement, 3 resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize', 4 recalc = function () { 5 var clientWidth = docEl.clientWidth;

xml文件的根节点layout_width或者layout_height设置无效果的原因分析

在android开发中相信大家对ListView.GridView等组建都很熟悉,在使用它们的时候需要自己配置相关的Adapter,并且配置现骨干的xml文件作为ListView等组建的子View,这些xml文件在Adapter的getView方法中调用.例如: public View getView(int position, View convertView, ViewGroup parent) { if(convertView==null) { convertView = App.getL

js获取input长度并根据页面宽度设置大小

1. js获取页面宽度高度及屏幕分辨率 网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:document.body.offsetWidth (包括边线的宽) 网页可见区域高:document.body.offsetHeight (包括边线的宽) 网页正文全文宽:document.body.scrollWidth 网页正文全文高:document.body.scrollHeight 网页被卷去

CSS3 Media Query实现响应式Web设计(针对不同移动设备宽度)

如今的屏幕分辨率,小至320px(iPhone),大到2560px甚至更高(大显示器),变化范围极大.除了使用传统的台式机,用户会越来越多的通过手机.上网本.iPad一类的平板设备来浏览页面.这种情况下,固定宽度的设计方案将会显得越发不合理.页面需要有更好的适应性,其布局结构要做到根据不同的设备及屏幕分辨率进行响应调整.接下来,我们将了解一下怎样通过HTML5和CSS3 Media Queries(媒介查询)相关技术来实现跨设备跨浏览器的响应式Web设计方案 范例效果预览 首先,我们来看看本篇范

设备宽度

出处:http://blog.csdn.net/zjlovety/article/details/6641644 网页可见区域宽:document.body.clientWidth网页可见区域高:document.body.clientHeight网页可见区域宽:document.body.offsetWidth (包括边线的宽)网页可见区域高:document.body.offsetHeight (包括边线的宽)网页正文全文宽:document.body.scrollWidth网页正文全文高: