css3 - 如何使用css将select的边框以及右边的小三角形去掉?
大家讲道理
大家讲道理 2017-04-17 11:20:02
0
3
669

最好css2,css3都给出解决方案,效果如下:

大家讲道理
大家讲道理

光阴似箭催人老,日月如移越少年。

全部回覆(3)
Peter_Zhu

CSS2 只能使用pul進行模擬了,結構很簡單,具體可參考Alice的 button-dropdown
CSS3 可以使用CSS3的屬性appearance,具體程式碼如下:

select{
    -moz-appearance: none;
    -webkit-appearance:none;
            appearance:none;  
}
黄舟

很遺憾,原生的表單元素的預設樣式受控於瀏覽器的定制,這個並沒有標準可遵循。不同的瀏覽器允許你做不同程度的修改,然而完全可靠的跨瀏覽器方案是不存在的。因此樓上說得對,如果要確保 UI 的一致性,只能自己模擬一個。

以下程式碼會在 chrome 和 firefox 上有效(但版本覆蓋不全)

-moz-appearance: none;
-webkit-appearance: none;
appearance: none;

然而其他瀏覽器就鬼知道了。

黄舟

去掉幹嘛, 模擬一個撒。

熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板