自己用的reset.css,大部分转载,加上自己常用的设置
@charset "UTF-8";
/*
KISSY CSS Reset
理念:清除和重置是紧密不可分的
特色:1.适应中文 2.基于最新主流浏览器
维护:玉伯(lifesinger@gmail.com), 正淳(ragecarrier@gmail.com)
*/
/* 清除内外边距 */
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, /* structural elements 结构元素 */
dl, dt, dd, ul, ol, li, /* list elements 列表元素 */
pre, /* text formatting elements 文本格式元素 */
fieldset, lengend, button, input, textarea, /* form elements 表单元素 */
th, td { /* table elements 表格元素 */
margin: 0;
padding: 0;
}
/* 设置默认字体 */
body,
button, input, select, textarea { /* for ie */
/*font: 12px/1 Tahoma, Helvetica, Arial, "宋体", sans-serif;*/
font: 12px/1 Tahoma, Helvetica, Arial, "\5b8b\4f53", sans-serif; /* 用 ascii 字符表示,使得在任何编码下都无问题 */
}
h1 { font-size: 18px; /* 18px / 12px = 1.5 */ }
h2 { font-size: 16px; }
h3 { font-size: 14px; }
h4, h5, h6 { font-size: 100%; }
address, cite, dfn, em, var { font-style: normal; } /* 将斜体扶正 */
code, kbd, pre, samp, tt { font-family: "Courier New", Courier, monospace; } /* 统一等宽字体 */
small { font-size: 12px; } /* 小于 12px 的中文很难阅读,让 small 正常化 */
/* 重置列表元素 */
ul, ol { list-style: none; }
/* 重置文本格式元素 */
a { text-decoration: none; }
a:hover { text-decoration: underline; }
abbr[title], acronym[title] { /* 注:1.ie6 不支持 abbr; 2.这里用了属性选择符,ie6 下无效果 */
border-bottom: 1px dotted;
cursor: help;
}
q:before, q:after { content: ''; }
/* 重置表单元素 */
legend { color: #000; } /* for ie6 */
fieldset, img { border: none; } /* img 搭车:让链接里的 img 无边框 */
/* 注:optgroup 无法扶正 */
button, input, select, textarea {
font-size: 100%; /* 使得表单元素在 ie 下能继承字体大小 */
}
/* 重置表格元素 */
table {
border-collapse: collapse;
border-spacing: 0;
}
/* 重置 hr */
hr {
border: none;
height: 1px;
}
/* 让非ie浏览器默认也显示垂直滚动条,防止因滚动条引起的闪烁 */
body,html { overflow-x: hidden;width: 100%;height: 100%;
-webkit-overflow-scrolling : touch; /* !* liuhx:可以把这整行注释掉对比差别 *! */
/* 上面这个是ios系统独有的允许独立区域,回弹效果,之前做iscroll在ios上拉被截断至一截区域内,用了DebugGap才找出原来是上面的属性问题*/
}
/*清除ios原生的按钮样式*/
input[type=button],button{
-webkit-appearance:none;
outline:none
}
/*加在父级 清除浮动*/
.clear{
zoom:1;
/*ie系列*/
}
.clear:after{
content:"";
clear:both;
display:block;
}
/*加在父级,禁止用户选中其下的文字*/
.no-selected{
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
/*清除a标签的伪类事件*/
.nona a,.nona a:hover,.nona a:link,.nona a:visited{
text-decoration: none;
}
/*清除input=number的上下箭头*/
input::-webkit-inner-spin-button {
-webkit-appearance: none;
}
/*去除点击延迟*/
a[href], button {
-ms-touch-action: none; /* IE10 */
touch-action: none; /* IE11 */
}
.pull-left{
float: left !important;
}
.pull-right{
float: right !important;
}
.float-l{
float: left;
}
.float-r{
float: right;
}
自己用的reset.css,大部分转载,加上自己常用的设置的更多相关文章
- 谈谈一些有趣的CSS题目(十一)-- reset.css 知多少?
开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...
- Reset CSS:只选对的,不选"贵"的
玉伯和正淳一起整理的一份 reset.css: /* KISSY CSS Reset 理念:清除和重置是紧密不可分的 特色:1.适应中文 2.基于最新主流浏览器 维护:玉伯(lifesinger@gm ...
- [css]【转载张鑫旭】我是如何对网站CSS进行架构的
一.写在前面的 都是自己积累形成的一些东西,可能带有明显的个人印记.不是专业内容,不是权威指南,只是展示一点自己的观点,借此希望能与各位优秀的同行交流看法,见解.以得到进步与提高. 二.我所知的一些过 ...
- 打造自己的reset.css
http://shawphy.com/2009/03/my-own-reset-css.html 最近我对此观点有所新的看法,可以查看<真的还需要reset.css么?> 0,引言 每每有 ...
- reset.css css重置公共样式
@charset "utf-8";/*Css Document*/ /*! * @名称:reset.css * @功能:1.重设浏览器默认样式 * 2.设置通用原子类 *//* 防 ...
- 1.reset.css的设置
/* reset css */ *, ::before, ::after{ /*选择所有的标签 */ margin: 0; padding: 0; /*清除移动端默认的 点击高亮效果*/ -webki ...
- 关于reset.css的疑问:为什么一定要重置浏览器样式?
自开始做前端算起,我所做过的每一个项目中都会有一个reset.css,也就是重置样式表.我现在想想都不知道第一次是从哪儿弄来的一个重置样式表.快五年了,好像从来都没有质疑过关于重置样式表的内容. 这样 ...
- Normalize.css 与 reset.css
Normalize.css 与 reset.css都是初始化页面样式 不同点在于 reset.css更加粗暴,直接把所有的样式全部初始化了: Normalize.css还剩点良心,还保留了一些浏览器默 ...
- YUI Reset CSS (学习摘抄)
正在使用CSS的你,用过CSS Reset吗?当然,或许你用了,却不知道正在用,比如你可能用到: *{ margin: 0; border: 0; padding: 0; } 这 ...
随机推荐
- Image Style Transfer:多风格 TensorFlow 实现
·其实这是一个选修课的present,整理一下作为一篇博客,希望对你有用.讲解风格迁移的博客蛮多的,我就不过多的赘述了.讲一点几个关键的地方吧,当然最后的代码和ppt也希望对你有用. 1.引入: 风格 ...
- 五、XML与xpath--------------爬取美女图片
除了正则表达式处理HTML文档,我们还可以用XPath,先将 HTML文件 转换成 XML文档,然后用 XPath 查找 HTML 节点或元素. 先用一个小实例开头吧(爬去贴吧每个帖子的图片): im ...
- javaweb重定向的两种方式
第一种 import java.io.IOException; import javax.servlet.ServletException; import javax.servlet.http.Htt ...
- ajax请求 readyState为0 可能原因之一
问题:同样的代码逻辑,PC端和iOS都能正常访问,但是Android系统请求都是报错: 上网查阅,关于ajax请求失败且状态码都是0的情况有很多,最后排查的原因是:域名证书问题:
- python爬虫登录
python3 urllib.request 网络请求操作 http://www.cnblogs.com/cocoajin/p/3679821.html python实现 爬取twitter用户姓名 ...
- Install Centrifugo and quick start
Install Centrifugo and quick start Go is a perfect language - it gives developers an opportunity to ...
- PHPUnit-附录 C. XML 配置文件
[http://www.phpunit.cn/manual/5.7/zh_cn/appendixes.configuration.html] PHPUnit <phpunit> 元素的属性 ...
- HDU 6035(树形dp)
题意略. 思路:有n * (n - 1) / 2这么多边,要枚举是不可能的,感觉和数据结构也沾不上边.再加上树上染色,以一条边上不同颜色作为这个边的值,这看起来像是算贡献那种题,和17icpc沈阳的某 ...
- WordUtil java导出word工具类
import java.io.BufferedInputStream;import java.io.BufferedOutputStream;import java.io.BufferedWriter ...
- 对TCP三次握手四次分手还不清楚的速度进,超简单解析,明白了就很好记!
关于TCP三次握手四次分手,之前看资料解释的都很笼统,很多地方都不是很明白,所以很难记,前几天看的一个博客豁然开朗,可惜现在找不到了.现在把之前的疑惑总结起来,方便一下大家. 先上个TCP三次握手和四 ...