Comment supprimer les coins arrondis des champs de saisie de texte sur iPhone/Safari ?

Désactiver l'arrondi des éléments de saisie sur iPhone/Safari

Certains sites Web peuvent rencontrer un problème où les champs de saisie de texte apparaissent avec des coins arrondis indésirables sur iPhone/ Navigateurs Safari. Cela peut entrer en conflit avec la conception prévue du site Web.

Solution CSS

Pour supprimer les coins arrondis spécifiquement sur Safari, sans affecter les autres navigateurs, modifiez le style de l'élément de saisie en utilisant CSS :

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

CSS supplémentaire pour les entrées de recherche

Pour les champs de saisie de recherche, une propriété supplémentaire est requise :

<code class="css">input[type="search"] {
  -webkit-appearance: none;
}</code>

Versions iOS héritées

Pour les versions iOS héritées (antérieures à iOS 5), utilisez plutôt la propriété CSS suivante :

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

Remarque : Pour compatibilité entre différents navigateurs et plates-formes, envisagez de normaliser les coins arrondis à l'aide de la propriété border-radius, car Apple pourrait abandonner la prise en charge de la propriété préfixée -webkit-border-radius à l'avenir.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!