解决手机浏览器和微信中select中border:none;无用和去掉小三角

设置select的边框为none；在PC端是没有问题的，但是放到手机浏览器和微信里上还是会出现边框

解决办法：

 appearance:none;
 -moz-appearance:none; /* Firefox */
 -webkit-appearance:none; /* Safari 和 Chrome */

appearance使用方法：

 .elmClass{
     -webkit-appearance: value;
     -moz-appearance: value;
     appearance: value;
 }

例子：使用appearance属性改变元素的外观

 <p class="lookLikeAButton">我是一个段落P元素 </p>
 <p class="lookLikeAListbox">我是一个段落P元素 </p>
 <p class="lookLikeAListitem">我是一个段落P元素 </p>
 <p class="lookLikeASearchfield">我是一个段落P元素 </p>
 <p class="lookLikeATextarea">我是一个段落P元素 </p>
 <p class="lookLikeAMenulist">我是一个段落P元素</p>

 /*看起来像个按钮，以按钮的风格渲染*/
 .lookLikeAButton{
      -webkit-appearance:button;
      -moz-appearance:button;
 }
 /*看起来像个清单盒子，以listbox风格渲染*/
 .lookLikeAListbox{
      -webkit-appearance:listbox;
      -moz-appearance:listbox;
 }
 /*看起来像个清单列表，以listitem风格渲染*/
 .lookLikeAListitem{
      -webkit-appearance:listitem;
      -moz-appearance:listitem;
 }
 /*看起来像个搜索框，以searchfield风格渲染*/
 .lookLikeASearchfield{
      -webkit-appearance:searchfield;
      -moz-appearance:searchfield;
 }
 /*看起来像个文本域，以textarea风格渲染*/
 .lookLikeATextarea{
      -webkit-appearance:textarea;
      -moz-appearance:textarea;
 }
 /*看起来像个下接菜单，以menulist风格渲染*/
 .lookLikeAMenulist{
      -webkit-appearance:menulist;
      -moz-appearance:menulist;
 }

更多内容可以参考http://www.w3school.com.cn/cssref/pr_appearance.asp