儘管有 W3 規範，如何在 Safari 和 IE 中使用填充來設定選擇清單的樣式？

在Safari 和IE 中使用填充來設計選擇清單

儘管W3 規範不禁止在選擇框中使用填充，但Webkit 瀏覽器如因為Safari 和Chrome 不支援此功能。為了達到預期的效果，請考慮用 text-indent 取代 padding-left 屬性，並確保相應地調整選擇框寬度。

範例：

在下面程式碼片段中，padding-left 屬性被刪除並替換為text-indent：

<code class="html"><select id="sexID" name="user[sex]" 
        style="border:1px solid #C1272D;
               width:258px; // 243 + 15px
               text-indent:15px;
               height:25px;
               color:#808080;"></code>

透過加入與填充佔用的相同數量的文字縮進，選擇框現在具有左對齊文字欄位。此解決方法有效地模擬了 Safari 和 IE 中的填充行為，從而在不同瀏覽器之間提供一致的樣式體驗。

以上是儘管有 W3 規範，如何在 Safari 和 IE 中使用填充來設定選擇清單的樣式？的詳細內容。更多資訊請關注PHP中文網其他相關文章！