Rumah > hujung hadapan web > tutorial css > Bagaimana untuk mengalih keluar Sudut Bulat daripada Medan Input dalam iPhone/Safari?

Bagaimana untuk mengalih keluar Sudut Bulat daripada Medan Input dalam iPhone/Safari?

Barbara Streisand
Lepaskan: 2024-10-30 21:54:02
asal
1109 orang telah melayarinya

How to Remove Rounded Corners from Input Fields in iPhone/Safari?

Penghapusan Pembundaran Elemen Input iPhone/Safari

Medan input biasanya mempamerkan rupa bulat dalam pelayar iPhone/Safari, bercanggah dengan yang dikehendaki reka bentuk segi empat tepat. Artikel ini menyelidiki kaedah untuk mengubah suai gaya elemen input melalui CSS atau metadata.

Penyelesaian untuk iOS 5 dan Kemudian:

Untuk mengalih keluar sudut bulat pada iOS 5 dan lebih baharu , laksanakan CSS berikut:

<code class="css">input {
  border-radius: 0;
}

input[type="search"] {
  -webkit-appearance: none;
}</code>
Salin selepas log masuk

Kaedah Alternatif:

Untuk penyingkiran sudut bulat khusus iOS, atau dalam kes di mana normalisasi merentas platform tidak dapat dilaksanakan , pertimbangkan CSS berikut:

<code class="css">input {
  -webkit-border-radius: 0;
}</code>
Salin selepas log masuk

Walau bagaimanapun, ambil perhatian bahawa sokongan untuk sifat awalan seperti ini mungkin akan dihentikan pada masa hadapan.

Penyelesaian Penyemak Imbas Warisan:

Untuk versi iOS yang lebih lama, adalah perlu untuk menggunakan sifat -webkit-appearance:

<code class="css">input {
    -webkit-appearance: none;
}</code>
Salin selepas log masuk

Atas ialah kandungan terperinci Bagaimana untuk mengalih keluar Sudut Bulat daripada Medan Input dalam iPhone/Safari?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan