Bagaimana untuk Menggayakan Senarai Pilih dengan Padding dalam Safari dan IE Walaupun Spesifikasi W3?

Menggayakan Senarai Pilihan dengan Padding dalam Safari dan IE

Walaupun spesifikasi W3 tidak melarang penggunaan padding dalam kotak terpilih, pelayar Webkit seperti kerana Safari dan Chrome tidak menyokong ciri ini. Untuk mencapai kesan yang diingini, pertimbangkan untuk menggantikan sifat padding-left dengan text-indent, memastikan untuk melaraskan lebar kotak pilihan dengan sewajarnya.

Contoh:

Dalam yang berikut coretan kod, sifat padding-left dialih keluar dan digantikan dengan 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>

Dengan menambahkan jumlah lekukan teks yang sama seperti yang akan diduduki oleh padding, kotak pilihan kini mempunyai jajaran kiri medan teks. Penyelesaian ini secara berkesan mensimulasikan gelagat pelapik dalam Safari dan IE, memberikan pengalaman penggayaan yang konsisten merentas pelayar yang berbeza.

Atas ialah kandungan terperinci Bagaimana untuk Menggayakan Senarai Pilih dengan Padding dalam Safari dan IE Walaupun Spesifikasi W3?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!