Maison  >  Article  >  interface Web  >  Comment supprimer les coins arrondis des champs de saisie dans iPhone/Safari ?

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

Barbara Streisand
Barbara Streisandoriginal
2024-10-30 21:54:02908parcourir

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

Élimination de l'arrondi des éléments de saisie iPhone/Safari

Les champs de saisie présentent généralement une apparence arrondie dans le navigateur iPhone/Safari, en conflit avec l'apparence souhaitée. conception rectangulaire. Cet article examine les méthodes permettant de modifier le style de l'élément d'entrée via CSS ou des métadonnées.

Solution pour iOS 5 et versions ultérieures :

Pour supprimer les coins arrondis sur iOS 5 et versions ultérieures , implémentez le CSS suivant :

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

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

Méthode alternative :

Pour la suppression spécifique à iOS des coins arrondis, ou dans les cas où la normalisation multiplateforme n'est pas réalisable , considérez le CSS suivant :

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

Cependant, notez que la prise en charge de propriétés préfixées comme celle-ci pourrait être interrompue à l'avenir.

Solution de navigateur héritée :

Pour les anciennes versions d'iOS, il était nécessaire d'utiliser la propriété -webkit-apparence :

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

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn