css小技巧: select的css控制

來源:互聯網
上載者:User


select控制項用CSS不太好管!
在style裡寫上   width:??px;這個可以實現. 
                        height:??px; 這個就實現不了. 只能通過調整裡面字型的大小來改變高度.
                       background可以實現,但用背景圖就不行了.

select的border是預設的藍色, CSS用border屬性是改變不了的. 只有通過偽裝的方法才能讓邊框改變,下面詳細介紹一下:
思路:先建一個帶有預想邊框的層, 在裡面放上select,其中select的尺寸要比div稍微大一點,讓超出層的內容隱藏從而遮蓋住select內建的邊框.

<div style="border:solid 1px #ffcc00; width:100px; height:20px;overflow:hidden;">           <select name="select" style="width:105px;   height:25px; margin-left:-1px; margin-top:-1px;" name="select" >             <option value="1">普通會員</option>             <option value="2">二級分會或地方分會</option>             <option value="3">協會</option>           </select></div>

用這種方法即可以讓select沒有邊框,也可以改變邊框. 但這隻限於select的list狀態. 當顯示成multiple狀態的時候,在IE裡都會有一框深限的痕迹,在FF裡沒有!   小樣兒,真不好控制!

相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.