設置字體大小在Chrome下拉似乎並沒有影響到造型

我設置字體大小在Chrome的下拉列表中，但它並沒有出現改變的<select>設置字體大小在Chrome下拉似乎並沒有影響到造型

它適用於FF尺寸 - 當我設置的字體大小爲15px，它明顯更大

2011-04-14 ming yeow

給一個想了解 – sandeep 2011-04-14 06:50:11

@sandeep：我覺得諷刺的是，我不明白您的評論。 – BoltClock 2011-04-14 06:51:53

從技術上講，這不正確的行爲嗎？如果我更改'font-size'，我不希望元素本身的大小發生變化。我認爲這取決於select元素是默認的內聯還是內聯塊。塊元素不會根據字體大小和內聯元素的大小更改大小。 – Bazzz 2011-04-14 06:58:42

某些瀏覽器將允許您自行修改font-size，有些不會。

您可以通過設置border樣式來黑客select元素的瀏覽器特定樣式。

select { 
 
    border: 1px solid #ccc; 
 
    font-size: 2em; 
 
}

<select> 
 
    <option>Quick</option> 
 
    <option>Brown</option> 
 
    <option>Fox</option> 
 
</select>

來源

2011-04-14 13:08:28 wdm

>它實際上不會改變我。這很奇怪。 – 2011-04-20 09:18:53

如果Chrome和Safari瀏覽器只是忽略你的高度，FONT-FAMILY和字體大小的選擇CSS設置：添加border屬性可以幫助Webkits尊重您的設置。

實施例：

select { 
border: 1px solid #a4a4a4; /*Same grey as default appearance*/ 
(background: transparent; /*Would work too, but adds an ugly black border*/) 
font-family: times; /*Now in webkit too*/ 
font-size: 30px; /*Now in webkit too*/ 
}

來源

2013-04-05 11:36:37

是的，就是這樣。奇怪，但它適用於Mac。 – 2015-09-03 10:59:19

另一個解決方法是用-webkit-appearance: menulist-button;樣式化<select>元件。

select { -webkit-appearance: menulist-button; font-size: 25px; }

<select> 
 
    <option>A</option> 
 
    <option>BB</option> 
 
    <option>CCC</option> 
 
</select>

來源

2015-03-08 10:46:31

設置字體大小在Chrome下拉似乎並沒有影響到造型

回答

相關問題