我们经常会碰到在webkit内核浏览器中,显示input标签、button按钮等元素的样式比较怪异。这是因为在webkit内核浏览器中,对这些元素设置了默认的初始化样式。那我们如何进行重置样式呢?这里给一份初始化css的样式,供大家参考。

样式的初始化

/* -------------@ reset css------------ */
* {
  /*清除浏览器的高亮背景*/
  -webkit-tap-highlight-color:rgba(0,0,0,0);
  -webkit-tap-highlight-color:transparent; /*For some Androids*/
}
html, body {
  width:100%;
}
body {
  -webkit-text-size-adjust:none;/*支持设置小于12px的字体*/
  -webkit-touch-callout:none;/*禁用ios系统长按弹出默认菜单*/
  -webkit-user-select:none;/*禁止用户长按选择文本*/
}
body, h1, h2, h3, h4, h5, hr, p, blockquote, nav, header, section,footer,
dl, dt, dd, ul, ol, li,
pre,
fieldset, lengend, button, input, textarea,
th, td {
  margin:0;
  padding:0;
  
}
ul, ol, li {
  list-style:none;
}
button, input, input[type="button"], input[type="reset"], input[type="submit"] {
  -webkit-appearance:none;
}
button, input, select, textarea {
  vertical-align:middle;
  outline:none;
  border:none;
}
textarea {
  resize:none;
  font-family:inherit;
}
h1, h2, h3, h4, h5, h6 {
  font-size:100%;
  font-weight:normal;
}
a {
  text-decoration:none;
  outline:none;
}
img {
  vertical-align:niddle;
  border:none;
}
table {
  border-collapse:collapse;
  border-spacing:0;
}
ins {
  text-decoration:none;
}
i {
  font-style:normal;
}

/*-----------------@ global HTML Element style-------------------*/
body {
    font-family: "PingFang Medium","PingFang SC","Source Han Sans";
    font-size: 16px;
    font-weight: normal;
    line-height: 1.2em;
}