input[type="date"]默认样式修改

最近写一个页面，用到了date类型的input，不得不说，挺好用的，免去了额外引入第三方插件的麻烦，但与此同时，也出现了新的麻烦，那就是input[type=”date”]自带的一些样式，比如删除ICON，上下箭头等等，着实让人头疼，下面我介绍下几种去除此类样式的方法。

<input type="date" value="1993-08-01" max="2017-03-11" min="1900-01-01">

这是常见的date类型input的写法，写完后的展示效果如下：

可以看到后面会多出一个删除的ICON和弹出日历框的向下箭头，那么要怎么移除嘞？上代码！

/*----------用来移除向下箭头----------*/
input[type="date"]::-webkit-calendar-picker-indicator {
   display: none;
}

/*----------用来移除叉叉按钮----------*/
input[type="date"]::-webkit-clear-button{
   display:none;
}

ok，这样一来，让人头疼的默认样式就被干掉了~完美~
当然，input[type=”date”]只是其中一种，还有类似time类型的input也有这样的基带样式，有时在项目中也是需要被改写或者去掉的，具体方法请移步：http://trac.webkit.org/wiki/Styling%20Form%20Controls#inputelement。

最后，再推荐张鑫旭大神的一个DEMO，在此文章中，我受益良多，也推荐给各位：
传送门：http://www.zhangxinxu.com/study/201306/pseudo-elements-to-style-type-date.html

希望对各位小伙伴有所帮助~