浏览器兼容性
清除ie10 select 框的下拉箭头:
/* 清除ie的默认选择框样式清除,隐藏下拉箭头 */
select::-ms-expand { display: none; }
/* 修改placeholder样式 */
input::-webkit-input-placeholder{
color:red;
}
input::-moz-placeholder{ /* Mozilla Firefox 19+ */
color:red;
}
input:-moz-placeholder{ /* Mozilla Firefox 4 to 18 */
color:red;
}
input:-ms-input-placeholder{ /* Internet Explorer 10-11 */
color:red;
}
/* 在 Chrome and Safari中,当我们使用CSS transforms 或者 animations时可能会有页面闪烁的效果,下面的代码可以修复此情况:*/
.cube {
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-perspective: 1000;
-moz-perspective: 1000;
-ms-perspective: 1000;
perspective: 1000;
/* Other transform properties here */
}
css 浏览器重置样式汇总:
html,
body {
height: 100%;
width: 100%;
}
body {
font-family: Helvetica, sans-serif;
}
* {
padding: 0;
margin: 0
}
ul,
li {
list-style: none;
}
a {
text-decoration: none;
}
:link, :visited { text-decoration:none }
// Firefox 会默认img 为内敛元素,如同span
// 不设置inline-block,则Firefox 下css 设置 width、height 无效
img {
border-style: none;
display: inline-block;
}
input,
textarea,
img,
video,
object { box-sizing: border-box; }
[hidden] {
display: none;
}
// 异步加载图片时,保持文档流中的占位信息,使体验更加良好
// 如果使用透明图片占位,则会发送没必要的请求
img { visibility: hidden; }
img[src] { visibility: visible; }
(待补充)
至此,结束。