web移动端css reset
通用版css reset,pc端使用只需要修改html{font-size: 10px;}为html{font-size: 12px;}
@charset "utf-8";
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
width: 100%;
height: 100%;
}
html {
font-family: 'sans-serif',"Microsoft YaHei","微软雅黑","Tahoma","Helvetica";
font-size: 10px;
background: #fff;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
-webkit-tap-highlight-color: rgba(0,0,0,0)
}
table {
border-collapse: collapse;
border-spacing: 0;
}
img {
border: 0; max-width:100%!important;
vertical-align: middle;
}
address,caption,cite,code,dfn,i,em,strong,th,var {
font-weight: normal;
font-style: normal;
}
ol,ul {
list-style: none;
}
a {
text-decoration: none;
}
a:hover,a:focus {
outline: none;
}
caption,th {
text-align: left;
font-weight: normal;
}
h1,h2,h3,h4,h5,h6 {
font-weight: normal;
font-size: 100%;
}
q:before,q:after {
content: ”;
}
abbr,acronym {
border: 0;
}
button,input,optgroup,select,textarea {
margin: 0;
font: inherit;
color: inherit;
}
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box
}
:before,:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration {
-webkit-appearance: none;
}
article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,summary {
display: block;
}
@media screen and (min-width:100px) {
/* iPhone 4,5 */
html {
font-size: 10px;
}
}
@media screen and (min-width:320px) {
/* iPhone 4,5 */
html {
font-size: 10px;
}
}
@media screen and (min-width:375px) {
/* iPhone 6 */
html {
font-size: 12px;
}
}
@media screen and (min-width:414px) {
/* iPhone 6 plus */
html {
font-size: 12px;
}
}
@media screen and (min-width:600px) {
html {
font-size: 14px;
}
}
web移动端css reset的更多相关文章
- 移动端CSS重置
移动端 CSS Reset 该怎么写 为了应对各大浏览器厂商对浏览器默认样式的不统一处理,我们往往会进行一个 css reset 操作,由于没有标准而且受个人偏好影响,每个公司实现的都不尽相同.关于 ...
- web前端开发常用的10个高端CSS UI开源框架
web前端开发常用的10个高端CSS UI开源框架 随着人们对体验的极致追求,web页面设计也面临着新的挑战,不仅需要更人性化的设计理念,还需要设计出更酷炫的页面.作为web前端开发人员,运用开源 ...
- 移动端页面 css reset
这个是通用的 css reset.这个版本适用于 移动端页面 如果需要在 PC端使用,可以 修改 html{font-size: 10px;}为html{font-size: 12px;} 其他地方 ...
- [总结]CSS/CSS3常用样式与web移动端资源
CSS/CSS3常用样式与知识点 IE条件注释 条件注释简介 IE中的条件注释(Conditional comments)对IE的版本和IE非IE有优秀的区分能力,是WEB设计中常用的hack方法.条 ...
- HTML常用命名和CSS reset代码【收集总结】
CSS命名规则 头:header 内容:content/containe 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体布局宽度:wrapper 左右中:l ...
- web移动端开发技巧与注意事项汇总
一.meta的使用 1.<meta name="viewport" content="width=device-width,initial-scale=1.0, m ...
- 【转】web移动端一些常用知识
1.去掉 a,input 在移动端浏览器中的默认样式(半透明灰色遮罩阴影) a,button,input,optgroup,select,textarea { -webkit-tap-highligh ...
- 【转载】Web移动端Fixed布局的解决方案
特别声明:本文转载于EFE的<Web移动端Fixed布局的解决方案>.如需转载,烦请注明原文出处:http://efe.baidu.com/blog/mobile-fixed-layout ...
- 从web移动端布局到react native布局
在web移动端通常会有这样的需求,实现上中下三栏布局(上下导航栏位置固定,中间部分内容超出可滚动),如下图所示: 实现方法如下: HTML结构: <div class='container'&g ...
随机推荐
- 6. Spark SQL和Beeline
*以下内容由<Spark快速大数据分析>整理所得. 读书笔记的第六部分是讲的是Spark SQL和Beeline. Spark SQL是Spark用来操作结构化和半结构化数据的接口. 一. ...
- Git仓库的提交记录乱成一团,怎么办?
大家好,今天和大家聊聊git当中一个非常好用的功能--区间选择,它可以帮我们处理看起来非常复杂的提交记录.从而帮助我们很快找到我们需要的内容. 如果大家有参与过多人协同的项目开发,比如十几个人甚至更多 ...
- 加速OSD的启动
ceph是目前开源分布式存储里面最好的一个,但是在高负载下会有很多异常的情况会发生,有些问题无法完全避免,但是可以进行一定的控制,比如:在虚拟化场景下,重启osd会让虚拟机挂起的情况 重新启动osd会 ...
- inkscope完整安装配置
准备centos7基础系统 首先安装基础系统centos7 在安装选项那里选择base web server ,选择其他的也可以,选择mini安装会缺很多常用的软件包,后续需要一个个安装比较麻烦 关闭 ...
- java 关于 a==null 和 null==a, a.equals("123") 和“123”.equals(a)
一: a==null 和 null==a 实验 所以 a==null 和 null==a 没区别 二: a.equals("123") 和"123".equal ...
- asp.net core 使用 TestServer 来做集成测试
asp.net core 使用 TestServer 来做集成测试 Intro 之前我的项目里的集成测试是随机一个端口,每次都真实的启动一个 WebServer,之前也有看到过微软文档上 TestSe ...
- yum 常用命令使用
1.向服务器上传文件或者下载文件 我们知道我们经常需要向服务器上传文件,或者从服务器下载文件,rz和sz命令可以满足我们的要求, 只不过默认情况下是不能使用的.我们需要使用yum install lr ...
- 源码分析:Semaphore之信号量
简介 Semaphore 又名计数信号量,从概念上来讲,信号量初始并维护一定数量的许可证,使用之前先要先获得一个许可,用完之后再释放一个许可.信号量通常用于限制线程的数量来控制访问某些资源,从而达到单 ...
- 面试官:小伙子,给我说一下Java 数组吧
Java 数组 Java 语言中提供的数组是用来存储固定大小的同类型元素. 1.声明数组变量 首先必须声明数组变量,才能在程序中使用数组. dataType[] arrayRefVar; // 首选的 ...
- Java8常用的内置函数式接口(一)Predicate、Consumer、Supplier、Function
Java8常用的内置函数式接口(一) 简介 JDK 1.8 API中包含了很多内置的函数式接口.有些是在以前版本的Java中大家耳熟能详的,例如Comparator接口,或者Runnable接口.对这 ...