ios html5 网页取消默认样式

ios的的默认样式修改成扁平化的样式

重要的一句css  -webkit-appearance: none;  将样式清除

单数会出现将raido的选择按钮也会消失

所以需要对radio的样式进行重新设置

设置input框的样式

     input[type="text"]{-webkit-appearance: none; font-size: 12px;}  

设置radio选择之前和之后的样式

   input[type="radio"]:checked , input[type="checkbox"]:checked {
   -webkit-appearance: none;
 border-color: #f67200;
 background-color: #f67200;

 }

   input[type="radio"], input[type="checkbox"] {
 -webkit-appearance: none;
     position: relative;
     width: 14px;
     height: 14px;
     border: 1px solid #e6e6e6;
     -webkit-border-radius: 7px;
     border-radius: 7px;
     background-color: #fff;
     vertical-align: middle;
 }
    input[type="checkbox"] {
 -webkit-appearance: none;
     position: relative;
     width: 14px;
     height: 14px;
     border: 1px solid #e6e6e6;
     -webkit-border-radius: 2px;
     border-radius: 2px;
     background-color: #fff;
     vertical-align: middle;
 }

设置选择之后checkbox的样式

     input[type="checkbox"]:checked:after {
    content: '';
    position: absolute;
    left:  1px;
    top: 1px;
    width: 10px;
    height: 5px;
    border-left: 2px solid #fff;
    border-bottom: 2px solid #fff;
-webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);

}