CSS reset.css 自己的 浏览器兼容重置 CSS

/* 内外边距通常让各个浏览器样式的表现位置不同 */
html, body,
div, p, footer, header, menu, nav, section,
dl, dt, dd, ul, ol, li,     /* 有序列表,无序列表,定义列表 */
h1, h2, h3, h4, h5, h6,
form, fieldset, legend, input, textarea, button,     /* 表单元素 */
table, thead, tbody, th, tr, td
{
    margin:0;
    padding:0;
    box-sizing: border-box;
    border: none;
}

* {
    box-sizing: border-box;
}

/* 要注意表单元素并不继承父级 font 的问题 */
body,button,input,select,textarea {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 100%;
}

/* 去除 input 默认 X 重置按钮 */
input::-webkit-search-cancel-button {
    display: none;
}

/* 去掉 table cell 的边距并让其边重合 */
table {
    border-collapse:collapse;
    border-spacing:0;
}

/* ie bug:th 不继承 text-align */
th {
    text-align:inherit;
}

/* 去除默认边框 */
fieldset,img {
    border:none;
}
/* ie6 7 8(q) bug 显示为行内表现 */
iframe {
    display:block;
}
/* 去掉 firefox 下此元素的边框 */
abbr,acronym {
    border:none;
    font-variant:normal;
}
/* 一致的 del 样式 */
del {
    text-decoration:line-through;
}
address,caption,cite,code,dfn,em,th,var,i {
    font-style:normal;
}
/* 去掉列表前的标识,li 会继承 */
ol,ul {
    list-style:none;
}
/* 对齐是排版最重要的因素,别让什么都居中 */
caption,th {
    text-align:left;
}
/* 来自yahoo,让标题都自定义,适应多个系统应用 */
h1,h2,h3,h4,h5,h6 {
    font-size:100%;
    font-weight:400;
}
q:before,q:after {
    content:'';
}
/* 统一上标和下标 */
sub,sup {
    font-size:75%;
    line-height:0;
    position:relative;
    vertical-align:baseline;
}
sup {
    top:-0.5em;
}
sub {
    bottom:-0.25em;
}
/* 让链接在 hover 状态下显示下划线 */
/*a:active, button:active {*/
    /*background: rgba(0,0,0,.4);*/
/*}*/
/* 默认不显示下划线,保持页面简洁 */
ins,a {
    text-decoration:none;
}
/* 去除 ie6 & ie7 焦点点状线 */
a:focus,*:focus {
    outline:none;
}
a:active,*:active {
    outline:none;
}

textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"] {
    display: block;
    vertical-align: middle;
    border: 0;
    outline: none;
    -webkit-appearance: none; /* 方法2 */
}

posted on 2017-07-03 18:49  杨文鹏  阅读(282)  评论(0)    收藏  举报

导航