@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. Nginx http相关常用配置总结

    Nginx http相关常用配置总结   by:授客  QQ:1033553122   测试环境 nginx-1.10.0 client_max_body_size Syntax: client_ma ...

  2. Android性能优化9-ANR完全解析

    1.什么是ANR 在Android上,如果你的应用程序有一段时间响应不够灵敏,系统会向用户显示一个对话框,这个对话框称作应用程序无响应(ANR:Application Not Responding)对 ...

  3. java传输文件的简单方法

    假设现在已经打包了一个文件(1233444333),要将这个文件传输给另一方: package file; import java.io.*; public class F_PasswordUnPas ...

  4. A Java Runtime Environment (JRE) or Java Development Kit (JDK) must be available in order to run Eclipse. No Java virtual machine was found after searching the following locations: /usr/local/eclipse/

    linux系统下jdk是已经安装好的情况之下软件出现 A Java Runtime Environment (JRE) or Java Development Kit (JDK) must be av ...

  5. OAF--基础

    OAF是WEB界面,FORM是由JDK将FORM里面的东西插入到HTML UI里的: OAF由 Oracle Business Components for JAVA(BC4J)框架作为其模型部分,完 ...

  6. MySQL常用命令(二)

    1.索引分类 1.普通索引 2.唯一索引 3.主键索引 4.外键索引2.普通索引(index) 1.使用规则 1.一个表中可以有多个index字段 2.字段的值可以有重复,也可以为NULL值 3.经常 ...

  7. RHEL/Centos7 安装图形化桌面

    Linux是一个多任务的多用户的操作系统,好多linux爱好者在安装完linux后经常遇到一个问题——没有图形化桌面.今天小编在安装RHEL7的时候,一步留神没有安装图形化桌面,下面分享一下安装图形化 ...

  8. SpringBoot整合模板引擎

    一.SpringBoot整合freemarker: 1.引入freemarker模板依赖: <dependency> <groupId>org.springframework. ...

  9. Git&GitHub

    Git是一个开源的分布式版本控制系统,可以有效.高速地处理从很小到非常大的项目版本管理.  Git 是 Linus Torvalds 为了帮助管理 Linux 内核开发而开发的一个开放源码的版本控制软 ...

  10. C# -- 交错数组的使用

    C# -- 交错数组的使用 交错数组是元素为数组的数组.交错数组元素的维度和大小可以不同.交错数组有时称为“数组的数组”. 1. 举例一:子数组是长度相同的一维数组 static void Main( ...