1920*1080pc端适配
(function(doc, win) {
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function() {
var clientWidth = docEl.clientWidth;
var clientHeight = docEl.clientHeight;
//console.log(clientHeight);
if (!clientWidth) return;
docEl.style.fontSize = 100 * (clientHeight / 1080) + 'px';
};
if (!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);
//监控页面分辨率变化,修改对应的字体大小
(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 = * (clientWidth / ) + 'px'
};
if (!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);
1920*1080pc端适配的更多相关文章
- 手淘H5移动端适配方案flexible源码分析
移动端适配一直是一个值得探讨的问题,在业余时间我找了一些页面,查看了一些厂商对于移动端H5页面的适配方案,看到了几个典型的例子,今天就来记录一下我看到的第一个典型的例子,也是我们公司目前普通H5项目正 ...
- viewport移动端适配,读文笔记
文章地址: viewport移动端适配 笔记: 移动端适配目的: 希望在屏幕尺寸大小不同的手机上进行访问页面时,页面显示的效果能合理的展示,我们期望的是在手机屏幕较大时显示的内容比较大一些,手机屏幕小 ...
- 超详细讲解H5移动端适配
前言 移动互联网发展至今,各种移动设备应运而生,但它们的物理分辨率可以说是五花八门,一般情况UI会为我们提供375尺寸的设计稿,所以为了让H5页面能够在这些不同的设备上尽量表现的一致,前端工程师就不得 ...
- 从flexible.js引入高德地图谈起的移动端适配
曾几何时,前端还仅仅是PC端的.随着移动时代的兴起,h5及css3的推陈出新.前端的领域慢慢的由传统的pc端转入了移动端,这也导致了前端这一职业在风口的一段时间出尽了风头. 从开始的惶恐和无从下手,慢 ...
- Web移动端适配总结
移动端适配的相关概念以及几种方案总结 适配相关概念 布局视口(layout viewport):html元素的上一级容器即顶级容器,用于解决页面在手机上显示的问题.大部分移动设备都将这个视口分辨率设置 ...
- 小tips:使用rem+vw实现简单的移动端适配
首先设置meta属性,如下代码: <meta name="viewport" content="width=device-width, initial-scale= ...
- 移动端适配单位rem
0 写在前面 本周惊喜地发现,其他各个老师的软工班(罗杰老师班和欧阳老师班)的软工项目的alpha版本都已经发布了!(然而我们软工项目还没开始写代码…逃…) 十分好奇的我第一时间下载了一些他们的产品进 ...
- 移动端适配--flexible.js
引言: H5适配一直是一个比较普遍的问题,很多文章都会讲,最近开发了一个H5的项目使用了一下淘宝的 flexible.js,写一篇文章自己总结一下. 一.背景介绍: Flexible.js是淘宝公开的 ...
- rem移动端适配方案
一. rem vs em 单位 定义 特点 rem font size of the root element 以根元素字体大小为基准 em font size of the element 以父元素 ...
随机推荐
- HttpServletRequest 接口、HttpServletResponse 接口、请求转发与重定向
上篇文章我们讲了servlet的基本原理,这章将讲一下剩余的部分. HttpServletRequest 接口 该接口是 ServletRequest 接口的子接口,封装了 HTTP 请求的相关信息, ...
- KnockOut 绑定之foreach绑定
foreach绑定对于数组中的每一个元素复制一节标记语言,也就是html,并且将这节标记语言和数组里面的每一个元素绑定.当我们呈现一组list数据,或者一个表格的时候,十分有用. 如果你绑定的数组是一 ...
- java技术栈范畴
基础 进阶 数据 安全
- git rebase 合并多次提交.
一.应用场景 为什么需要合并多个提交呢? 常常一个功能的开发,修修补补 commit 了 n 多次,带来的结果就是提交过多过杂,不够直观,究竟哪些提交是对应这个功能的呢?还有就是,如果我要将这个功能迁 ...
- 一文了解腾讯云数据库SaaS服务
本文由云+社区发表 作者:邵宗文,2009年加入腾讯,现为腾讯云数据库专家产品经理.之前曾负责为OMG事业群构建数据库平台,部署,规划及运维支持,为腾讯网,新闻客户端,快报,视频,财经,体育等提供了稳 ...
- Windows内置安全主体
转自:https://blog.csdn.net/xcntime/article/details/51746148 导读:对于Windows内置安全主体特别需要注意的是:你无法创建.重命名和删除它们, ...
- kubernetes实战之运行aspnetcore webapi微服务 - kubernetes
1.预备工作 unbuntu 16.04 or above docker for linux kubernetes for linux 集群环境 2.使用vs2017创建一个web api应用程序,并 ...
- Sitecore® 8.2 Professional Developer考试心得
因工作原因入了Sitecore的坑.. 不了解Sitecore认证考试的同学请移步: http://www.cnblogs.com/edisonchou/archive/2018/08/17/9488 ...
- 【Linux基础】压缩和解压
Linux 常用的压缩与解压文件类型:.tar,.gz..tar.gz,.bz2..tar.bz2,.Z..tar.Z,.zip,.rar等. Linux 常用的压缩与解压缩命令有:tar,gzip. ...
- 【Android Studio安装部署系列】四十二、Android Studio使用Eclipse中的keystore为App签名
版权声明:本文为HaiyuKing原创文章,转载请注明出处! 概述 从eclipse迁移到AndroidStudio,要用原Eclipse的签名文件,这样才能保证转到AndroidStudio后更新的 ...