Comment réinitialiser le style par défaut de la page mobile ? Quelles sont les méthodes

Comment réinitialiser le style par défaut de la page mobile ? Je pense que de nombreux amis qui viennent d'entrer en contact avec des pages mobiles se poseront de telles questions. Ce chapitre va vous présenter comment réinitialiser le style par défaut de la page mobile ? Quelles sont les méthodes. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il vous sera utile.

1. -webkit-tap-highlight-color

-webkit-tap-highlight-color:rgba(0,0,0,0); //Définissez la transparence sur 0 et supprimez-la. Il s'agit de la superposition grise translucide par défaut (iOS) ou de la boîte virtuelle (Android) lorsque l'on clique sur des objets de lien et de zone de texte.

-webkit-tap-highlight-color:rgba (255,0,0,0.5); //Utilisez cet attribut pour définir la surbrillance de la zone de lien sur 50 % de rouge transparent lorsque vous touchez, uniquement sur iOS. . Tant que cet attribut est utilisé sur Android, il apparaîtra sous forme de bordure. Ajoutez cet attribut au corps pour vous assurer que la zone de clic du corps a le même effet.

2.outline : aucun

(1) Le but de la définition de ce style pour la balise a sur le PC est d'annuler la ligne pointillée qui apparaît lorsque l'on clique sur la balise a sur l'IE navigateur. Les navigateurs ie7 et inférieurs ne reconnaissent pas encore cet attribut. Vous devez ajouter hidefocus="true"

(2) input, textarea{outline:none} pour annuler le style de focus de la zone de texte par défaut sous chrome

(3) Cela ne fonctionne pas sur le terminal mobile. Si vous souhaitez supprimer le style par défaut de la zone de texte, vous pouvez utiliser -webkit-apparence Pour annuler le style par défaut lors de la mise au point, -webkit-tap-highlight. -couleur. J'ai vu certains fichiers de réinitialisation mobile ajouter cet attribut, mais il est en fait redondant.

3.-webkit-looking

-webkit-looking: none;//Élimine l'apparence native de la zone de saisie et du bouton Ce n'est qu'en ajoutant cet attribut sur iOS que le bouton et la saisie peuvent être effectués. box soit automatiquement Définir le style

Différents types d'entrée se comportent différemment après avoir utilisé cet attribut. Le texte et le bouton n'ont pas de style, la radio et la case à cocher disparaissent directement

4.-webkit-user-select

-webkit-user-select: none // Désactive la sélection du texte de la page, cet attribut ; L'héritage, généralement ajouté au corps, stipule que le texte de tout le corps ne sera pas automatiquement ajusté

5.-webkit-text-size-adjust

-webkit-text- size-adjust: none; //Désactivez le redimensionnement automatique du texte (par défaut, la taille du texte changera lors de la rotation de l'appareil). Généralement, il est ajouté au corps pour stipuler que le texte du périphérique est modifié. le corps entier ne sera pas automatiquement redimensionné

6 .-webkit-touch-callout

-webkit-touch-callout:none; // Désactivez le menu contextuel lorsque vous appuyez longuement sur la page ( valable sous iOS), les balises img et a doivent être ajoutées

7.-webkit-overflow-scrolling

-webkit-overflow-scrolling:touch;// Défilement partiel (uniquement pris en charge par iOS 5 ou supérieur)

Ce qui précède est le style par défaut de la page mobile Réinitialiser ? Toutes les méthodes sont présentées. Si vous souhaitez en savoir plus sur le Tutoriel vidéo HTML, veuillez faire attention au site Web PHP chinois.

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!