修改select標籤的預設邊框顏色

2021-08-22 10:11:59 字數 601 閱讀 1582

select標籤是一種特殊的控制項,他的預設邊框顏色沒法直接修改。

當要修改邊框顏色時,在select標籤外面先套一層div,先把select的邊框隱藏掉,再修改div的邊框來偽裝成select邊框。

下面是**的實現**

style="position:relative; border:1px solid #ff6666; width:80px; height:20px;"> 

style="position:absolute; clip:rect(2px 82px 22px 2px); margin:-2px; width:84px; height:24px; line-height:24px; background:#fff;"> 12

345

然後,我的select樣式是由框架預設的,沒找到方法隱藏掉select邊框,就直接用div的邊框覆蓋上了,效果略差,還有覆蓋的痕跡,如下圖:

最後附上jquery修改邊框的語法  $('#selectborder').css("border","1px solid #e6e6e6");

js 記錄五 修改select預設樣式

方法一 css js 預覽 請選擇 選項一選項二 選項三選項四 選項五選項六 選項七 來自 方法二 css js 複雜 html css部分 選擇風格 復古風搖滾風 懷舊風js部分 function function var li option ul option.find li li option...

定義select的邊框顏色

具體步驟 1.用margin屬性實現。先設定margin屬性為 2,以隱藏select物件原來的邊框,然後設定select物件的父物件的邊框。1 2程式設計客棧 3 4 5 2.margin屬性結合clip屬性實現。也是先用margin隱藏select的原邊框,再用clip控制select的可視區域...

js修改select的預設樣式,相容到ie8

於是我在網上下了一段 在外面執行是可以的,但是放到我的專案裡死活都有問題,後來我就稍稍修改了一下原本的js檔案,來實現我想要的效果。簡單的說就是將原來的select標籤隱藏起來,然後在select之前插入乙個無序列表來顯示原來的下拉列表,但是我專案中需要的還有 option的value值,要傳給後台...