@charset "UTF-8";

/* stylelint-enable */
/* 重置样式 */
* {
-webkit-tap-highlight-color: transparent;
outline:;
} body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td {
margin:;
padding:;
vertical-align: baseline;
} img {
border: 0 none;
vertical-align: top;
} i, em {
font-style: normal;
} ol, ul {
list-style: none;
} input, select, button, h1, h2, h3, h4, h5, h6 {
font-size: 100%;
font-family: inherit;
} table {
border-collapse: collapse;
border-spacing:;
} a, a:visited {
text-decoration: none;
color: #333;
} body {
margin: 0 auto;
background: #e8e8ed;
font-size: 14px;
font-family: -apple-system,Helvetica,sans-serif;
line-height: 1.5;
color: #666;
-webkit-text-size-adjust: 100% !important;
/*-webkit-user-select: none;
user-select: none;*/
} /* rem单位切换
---------------------------------------- */
/* html根元素大小
---------------------------------------- */
html {
font-size: 20vw;
} @media screen and (max-width: 320px) {
html {
font-size: 64px;
}
} @media screen and (min-width: 540px) {
html {
font-size: 108px;
}
} body {
max-width: 540px;
min-width: 320px;
}

原文:https://aotu.io/notes/2017/04/28/2017-4-28-CSS-viewport-units/?utm_source=tuicool&utm_medium=referral

https://jdc.jd.com/demo/ting/vw_rem_layout.html

移动端h5页面编写样式重置的更多相关文章

  1. 移动端H5页面高清多屏适配方案

    背景 开发移动端H5页面 面对不同分辨率的手机 面对不同屏幕尺寸的手机 视觉稿 在前端开发之前,视觉MM会给我们一个psd文件,称之为视觉稿. 对于移动端开发而言,为了做到页面高清的效果,视觉稿的规范 ...

  2. [转]:移动端H5页面高清多屏适配方案

    原文链接:http://www.tuicool.com/articles/YJviea 背景 开发移动端H5页面 面对不同分辨率的手机 面对不同屏幕尺寸的手机 视觉稿 在前端开发之前,视觉MM会给我们 ...

  3. 教你如何用 lib-flexible 实现移动端H5页面适配

    前话 好久没写教程了(可能会误导新手的菜鸟教程( ̄▽ ̄)"). 这是我的github,欢迎前端大大们和我一起学习交流 https://github.com/pwcong 最近入职公司做前端实 ...

  4. 解惑好文:移动端H5页面高清多屏适配方案

    背景 开发移动端H5页面 面对不同分辨率的手机 面对不同屏幕尺寸的手机 视觉稿 在前端开发之前,视觉MM会给我们一个psd文件,称之为视觉稿. 对于移动端开发而言,为了做到页面高清的效果,视觉稿的规范 ...

  5. 移动端H5页面的设计稿尺寸大小规范-转载自http://www.chinaz.com/design/2015/1103/465670.shtml

    机屏幕尺寸,设计稿应该按照哪一个尺寸作为标准尺寸.现在已经有2K分辨率的手机屏幕了,设计稿是不是也要把宽高跟着最大分辨率来设计.显然不是. 请注意:(以下所有讨论内容和规范均将viewport设定为c ...

  6. 移动端h5页面的设计稿尺寸

    当我们在做手机端H5网页设计稿时(当然包含微信端的H5网页设计),如果没有做过类似的移动端的设计,UI设计师和前端工程师肯定会纠结的.如果是app设计师,就不会那么纠结啦. 延伸阅读: 2015年度最 ...

  7. 移动端H5页面惯性滑动监听

    移动端H5页面惯性滑动监听 在移动端,当你快速滑动有滚动条的页面时,当你手指离开屏幕时,滚动条并不会立即停止,而是会随着"惯性"继续滑动一段距离. 在做项目的过程中,需要监听惯性滑 ...

  8. vue移动端h5页面根据屏幕适配的四种方案

    最近做了两个关于h5页面对接公众号的项目,不得不提打开微信浏览器内置地图导航的功能确实有点恶心.下次想起来了的话,进行总结分享一下如何处理.在vue移动端h5页面当中,其中适配是经常会遇到的问题,这块 ...

  9. 移动端H5页面开发,碰到一个字体变大的BUG

    移动端H5页面开发,碰到一个字体变大的BUG webkit内核下,对不定高宽的元素可能会放大其字体.那么,就可以设置一个max-width:或者使用-webkit-text-size-adjust: ...

随机推荐

  1. 使用Gson将对象类转成Json对象时出现\u003d的问题

    Gson将对象转成Json对象的方法 Gson gson=new Gson(); String json=gson.toJson(Student.class); 这种情况,如果Student属性中的某 ...

  2. Dynamics 365 Online-试用环境申请地址

    https://trials.dynamics.com/Dynamics365/Signup/sales 需要用企业邮箱

  3. vue-cil和webpack中本地静态图片的路径问题解决方案

    1 本地图片动态绑定img的src属性 一般我们在html中或者vue组件文件中引用图片是这样,这是不需要做特别处理的 我们将图片放入assets中或者重新建立个文件夹img什么的都可以,随意- 但是 ...

  4. C# 利用ZXing.Net来生成条形码和二维码

    本文是利用ZXing.Net在WinForm中生成条形码,二维码的小例子,仅供学习分享使用,如有不足之处,还请指正. 什么是ZXing.Net? ZXing是一个开放源码的,用Java实现的多种格式的 ...

  5. (后端)springboot 在idea中实现热部署(转)

    自己用到了iIntelliJ IDEA 这个ide工具,但是和以前的工具写html,css,js直接刷新页面不同,这个需要去热部署,网上搜的解决方法: SpringBoot的web项目,在每一次修改了 ...

  6. GPA简介

    GPA(Graphics Performance Analyzers)是Intel公司提供的一款免费的跨平台性能分析工具. 填写e-mail.name和country并提交后,就会收到一封有专属下载链 ...

  7. Java中数组、List、Set互相转换

    数组转List String[] staffs = new String[]{"Tom", "Bob", "Jane"}; List sta ...

  8. 第八章 Hyper-V 2012 R2 故障转移群集

    和终端用户相比,企业用户对于业务的连续性和可靠性更为在意.相对而言,企业一般不会将追逐单一硬件的性能排在第一位. 如何衡量业务是否持续可用,一般使用"x 个 9"这种方式来定义.如 ...

  9. Java循环语句怎么用?经典排序算法见真知

    Java中循环语句的使用,莫过于在排序算法中使用得最为经典. 排序算法非常的多,不过大体可以分为两种: 一种是比较排序,主要有:冒泡排序,选择排序,插入排序,归并排序,堆排序,快速排序等. 另一种是非 ...

  10. centos7如何安装gcc5.4

    由于需要使用到cilk plus和std=c++14,所以决定将编译器升级. 基本教程如下: 1.下载GCC源码: wget ftp://mirrors.kernel.org/gnu/gcc/gcc- ...