css清除select的下拉箭頭樣式


<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
        select::-ms-expand { display: none; }          
         .info-select{
            width: 88px;
            height: 25px;
            border: none;
            outline: none;
            /*將默認的select選擇框樣式清除*/
            appearance:none;
            -moz-appearance:none;
            -webkit-appearance:none;
            -ms-appearance:none;
           /*在選擇框的最右側中間顯示小箭頭圖片*/
           background: url(img/sele.png) no-repeat scroll right center transparent;     /***將sele.png替換為你的下拉箭頭**/      
         }
        </style>
    </head>
    <body>
        <select class="info-select">
            <option selected="selected">1</option>
            <option>2</option>
        </select>
    </body>
</html>

 本例可以更換selet下拉箭頭,只適用於非ie瀏覽器,ie樣式為默認樣式


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM