获取Dpi

在 window.load中添加:

(function(){
if (!window.screen.deviceXDPI){
var tmpNode = document.createElement("DIV");
tmpNode.style.cssText = "width:1in;height:1in;position:absolute;left:0px;top:0px;z-index:99;visibility:hidden";
document.body.appendChild(tmpNode);
window.screen.deviceXDPI = parseInt(tmpNode.offsetWidth);
window.screen.deviceYDPI = parseInt(tmpNode.offsetHeight);
tmpNode.parentNode.removeChild(tmpNode);
} //宽度毫米
window.screen.width_mm = window.screen.width / window.screen.deviceXDPI * 25.4;
window.screen.height_mm = window.screen.height / window.screen.deviceYDPI * 25.4;
})()

可以根据 屏幕的真实宽度与高度进行适配.

一些链接

http://blog.csdn.net/cuixiping/article/details/45966177

https://www.pengxb.com/

http://yincheng.site/crop-upload-photo

Html5前端笔记的更多相关文章

  1. 1.前端笔记之html

    title: 1.前端笔记之HTML date: 2016-04-04 23:21:52 tags: Python categories: Python --- 作者:刘耀 **出处:http://w ...

  2. 前端笔记-html

    前端笔记html 前端三大利器,html(本源),css(着装),js(动作) html 学习html就是学习一套规则能够被浏览器识别,在页面中展示,一个页面只能运行一个html 标签 <> ...

  3. HTML5基础——笔记

    HTML5基础——笔记 近几年来,互联网+.大数据.云计算‘物联网‘虚拟现实‘人工智能.机器学习.移动互联网等IT相关新名词.新概念层出不穷,相关产业发展如火如荼.互联网+移动互联网已经深入到人民日常 ...

  4. html5学习笔记一

    HTML5学习笔记 <video>标记:定义视频,Ogg.MPEG4.WebM三种格式 <video src=”movie.ogg”  controls=”controls”> ...

  5. HTML5前端(移动端网站)性能优化指南

    HTML5是一种最新发布网页构架的普遍模型,是构建对程序.对用户都更有价值的数据驱动的Web的前端技术框架,它的价值在于融合CSS/javaScript/flash等众多前端开发技术,更多的体现在对交 ...

  6. 2.前端笔记之css

    title: 1.前端笔记之CSS date: 2016-04-05 23:05:51 tags: 前端 categories: w3c --- 作者:刘耀 **出处:http://www.liuya ...

  7. 国内HTML5前端开发框架汇总

    国内HTML5前端开发框架汇总 Dawei Cheng 程大伟... 于 星期日, 02/12/2012 - 20:53 提交 国外很有多优秀的HTML5前端开发框架相信大家都耳熟能详:JQuery ...

  8. HTML5学堂 全新的HTML5/前端技术分享平台

    HTML5学堂 全新的HTML5/前端技术分享平台 HTML5学堂是做什么的? HTML5学堂~http://www.h5course.com~由多名热爱H5的讲师们组成的一个组织.致力于构建一个前端 ...

  9. HTML5 前端框架和开发工具【下篇】

    HTML5 前端框架和开发工具[下篇] 快速,安全,响应式,互动和美丽,这些优点吸引更多的 Web 开发人员使用 HTML5.HTML5 有许多新的特性功能,允许开发人员和设计师创建应用程序和网站,带 ...

随机推荐

  1. linux设置自动更换壁纸

    #!/bin/bash let n=0 files=($HOME/wallpapers/*.jpg) count=${#files[@]} while [ 1 ] do let "n=n%$ ...

  2. 阵列卡raid H730写策略write-through和write-back配置说明

    问题描述: 最近公司新进了测试服务器,但是在做阵列的时候忘记写策略里面的配置意思了 就网上查了一下,然后顺便做个笔记记录一下 write-through 数据在写入存储的同时,要写入缓存,这种方式安全 ...

  3. centos7执行umount提示:device is busy或者target is busy解决方法

    问题描述: 因为挂载错了,想取消挂载,但是umount报告如下错误: [root@zabbix /]# umount /dev/sdc1 umount: /data1: target is busy. ...

  4. Hibernate 中的 idclass mapping 问题

    关于出现 idclass mapping 运行错误 @IdClass 注释通常用于定义包含复合键id的Class.即多个属性的关键复合. @IdClass(CountrylanguageEntityP ...

  5. asp.net core 中使用StyleCop.StyleCopAnalyzers

    1.nuget中安装 StyleCop.Analyzers 当前版本1.1.0-beta004 2.在项目根目录新增 stylecop.json文件 { "settings": { ...

  6. python scrapy爬虫框架概念介绍(个人理解总结为一张图)

    python的scrapy是一个为了爬取网站数据,提取结构性数据而编写的应用框架   python和scrapy的安装就不介绍了,资料很多 这里我个人总结一下,能更加快理解scrapy和快速上手一个简 ...

  7. python五十四课——datetime模块

    3.datetime模块:理解:datetime可以认为是time模块的补充/扩展datetime模块中有一些常用类:datetime类:记录了日期和时间数据信息date类:记录了日期数据信息time ...

  8. API--ResponseBody-类

    import com.fasterxml.jackson.annotation.JsonInclude; import com.fasterxml.jackson.annotation.JsonInc ...

  9. eclipse 自动创建web.xml

    eclipse 自动创建web.xml 以前每次创建web项目的时候,总是从其他的项目中拷贝一个web.xml文件到新项目,然后改吧改吧就可以了,但是这终究是一件麻烦的事,要是能够通过软件自动创建,那 ...

  10. PHP实现DES加密,解决乱码

    PHP要实现DES加密,大体上有2个思路.一是用扩展,一是原生PHP实现. 这里推荐一个PHP原生实现的加密,是thinkphp的一个类库: https://github.com/top-think/ ...