CSS：更改選擇 - 選擇字體大小，如果外觀：無

所以，基本上我關掉本地選擇框的造型與CSS：更改選擇 - 選擇字體大小，如果外觀：無

-webkit-appearance: none;

，所以我可以有我自己的插入符號圖標。現在

，我想完成的是具有一個大小選擇框，選擇具有較大的字號

是這樣的：似乎

select.micro{ 
    font-size: 12px; 
} 

select.micro option{ 
    font-size: 16px; 
}

我不能使它工作...無論什麼我這樣做......兩者似乎都已連接，我不能在不影響選擇框本身的情況下更改大小（當它關閉以清除時）

來源

2016-08-23 DS_web_developer

這裏的小提琴：https://jsfiddle.net/77bpshbo/1/顯示在瀏覽器（v.52.0.2743.116米）在兩個不同的字體大小我。這可能是一個基於瀏覽器的問題，在你的代碼中的某個地方出現錯字還是我的誤解？ –

可悲的是我只能訪問chrome v40x ....兩種尺寸對我來說都是一樣的：/ –

你可以嘗試在選擇組中包裝你的選項並設計它。麻煩的是，你然後得到了項目 –

使用以下代碼可以確保appearance適用於每個眉毛SER。

，這是IE（就像appearance:none）：

select::-ms-expand { 
display: none; 
}

（在Chrome，火狐，Safari瀏覽器進行測試），如果它仍然無法正常工作，在select.micro option { font-size:16px!important}使用!important。我會建議它只作爲最後的手段。

select { 
 
    -webkit-appearance: none; 
 
    -moz-appearance: none; 
 
    appearance:none; 
 
} 
 
select::-ms-expand { 
 
    display: none; 
 
} 
 

 
select.micro { 
 
    font-size: 12px; 
 
} 
 

 
select.micro option { 
 
    font-size: 16px; 
 
}

<select class="micro"> 
 
    <option>Option 1</option> 
 
    <option>Option 2</option> 
 
    <option>Option 3</option> 
 
</select>

來源

2016-08-23 10:48:08

CSS：更改選擇 - 選擇字體大小，如果外觀：無

回答

相關問題