Safari と Internet Explorer で選択リストにパディングを適用する方法

Mary-Kate Olsen
リリース: 2024-10-24 08:44:01
オリジナル
255 人が閲覧しました

How to Apply Padding to Select Lists in Safari and Internet Explorer?

Safari および IE の選択リストにパディングが適用されない

Safari および Internet Explorer の選択リストのスタイルを強化することは、次の理由により困難になる場合があります。パディングのサポートが不足している。 World Wide Web Consortium (W3C) 仕様では選択ボックスのパディングが許可されていますが、Safari や Chrome などの Webkit ブラウザではこの機能が無視されます。

この問題を克服するための別のアプローチは、代わりに text-indent を利用することです。パディング左。選択ボックスの幅に同じ量を追加することで、目的の間隔を効果的に実現できます。

次のコードを検討してください:

<select id="sexID" name="user[sex]"
        style="border: 1px solid #C1272D;
               width: 258px; // 243 + 15px
               text-indent: 15px;
               height: 25px;
               color: #808080;">
ログイン後にコピー

この例では、目的の 15 ピクセルを実現する方法を示します。 text-indent: 15px を適用し、それに応じて選択ボックスの幅を増やすことでパディングします。

以上がSafari と Internet Explorer で選択リストにパディングを適用する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート