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 ...
随机推荐
- 第05组 Alpha冲刺 (4/6)(组长)
.th1 { font-family: 黑体; font-size: 25px; color: rgba(0, 0, 255, 1) } #ka { margin-top: 50px } .aaa11 ...
- jdk的动态代理和静态代理你还写不出来嘛???
一.什么叫jdk的代理? 用另外一个对象去代理实际对象的操作 分为动态代理和静态代理二.先说说静态代理 从字面意思来看就是不会改变的,只可以代理某个固定对象的. 静态代理就是通过实现和目标对象实现的同 ...
- sql 训练及总结
1.sql语句中=与in的区别,=是指一对一之间的等于,而in是指一对多之间的:同样的道理,<>与 not in的区别,<>是指一对一之间的不等于,而not in是指一对多之 ...
- PIP安装Django
1. 2. 3.升级PIP 4. 原来我已经用pycharm装过了,囧~
- 分库分表神器 Sharding-JDBC,几千万的数据你不搞一下?
今天我们介绍一下 Sharding-JDBC框架和快速的搭建一个分库分表案例,为讲解后续功能点准备好环境. 一.Sharding-JDBC 简介 Sharding-JDBC 最早是当当网内部使用的一款 ...
- http://www.etymon.cn/yingyucigen/3093.html
import requests import lxml.etree as etree import xml.etree.ElementTree as ET # 详情页 # 3093-148 # htt ...
- Python_Python处理JSON文件
# Python处理Json对象 # Python处理Json对象 ''' json.loads() 将JSON字符串转为Python对象 json.dumps() 将Python对象转为JSON字符 ...
- Python_selenium_WebDriver API,ActionChains鼠标, Keys 类键盘
WebDriver 提供的八种定位方法: find_element_by_id() find_element_by_name() find_element_by_class_name() find_e ...
- 【转】AWVS扫描小技巧
1.文件头加 Mozilla/5.0 (compatible; Baiduspider/2.0; +http://www.baidu.com/search/spider.html) 可以绕过狗,waf ...
- C++中class和struct区别
1.存储不同 结构体使用栈存储(Stack Allocation),而类使用堆存储(Heap Allocation). 栈的空间相对较小.但是存储在栈中的数据访问效率相对较高. 堆的空间相对较大.但是 ...