在火狐和谷歌浏览器里面,会出现有些样式不兼容的情况,所以为了界面美观,或多或少都要写一些兼容的代码,今天写一个在火狐浏览器里面,select下拉框样式兼容。
在谷歌浏览器,样式是这样的:
当时在火狐浏览器,右侧会有比较难看的小箭头:
这个时候,需要对火狐浏览器里面的select进行一些兼容的操作,需要在全局的css里面添加这一段代码。
/* 火狐浏览器 */ select { -moz-appearance: none; appearance: none; background-image: url("http://221.228.109.114:8083/manage/more/firefox_select_icon.png"); background-repeat: no-repeat; background-position: calc(100% - 7px) 50%; background-size: 2% auto; border-radius:3px; padding:0; }
添加完成之后就ok了。