css3 appearance 改变元素外观

h5 input标签的默认样式去除：

去掉

date

类型

<input>

框的叉叉：

::-webkit-clear-button {
-webkit-appearance: none;
}

去掉

number

类型

<input>

框的上下箭头：

::-webkit-inner-spin-button {
-webkit-appearance: none;    /* 上下小箭头按钮，你丫太丑了，滚粗，负分 */
}

去掉

search

类型

<input>

框的N多特征：

/* 去除圆角 */
input[type=search] { -webkit-appearance: none; }

/* 隐藏取消按钮 */
::-webkit-search-cancel-button { -webkit-appearance: none; }

/* 隐藏放大镜 */
::-webkit-search-results-button { -webkit-appearance: none; }

appearance

可以影响外观，但是不影响

box-sizing

，

box-sizing

是由

type

属性值决定的

原出处：http://www.zhangxinxu.com/wordpress/2016/07/css3-appearance-all-box-sizing/