Comment adapter le bootstrap à la taille de l'écran du téléphone portable

Tutoriels recommandés : Tutoriel Bootstrap

Afin de réaliser le site internet développé par Bootstrap adapté aux appareils mobiles Convivial, pour garantir un dessin et une mise à l'échelle appropriés de l'écran tactile, vous devez ajouter la balise méta viewport dans l'en-tête de la page Web, comme indiqué ci-dessous :

<meta name="viewport" content="width=device-width, initial-scale=1.0">

　width L'attribut contrôle la largeur de l'appareil. En supposant que votre site Web sera consulté par des appareils avec des résolutions d'écran différentes, le définir sur device-width garantit qu'il s'affichera correctement sur différents appareils.

　initial-scale=1.0 Assurez-vous que lorsque la page Web est chargée, elle sera rendue à un rapport 1:1 sans aucune mise à l'échelle.

Sur les navigateurs mobiles, le zoom peut être désactivé en ajoutant user-scalable=no à la fonction de balise viewport meta .

Généralement, maximum-scale=1.0 est utilisé avec user-scalable=no . En désactivant le zoom, les utilisateurs peuvent uniquement faire défiler, ce qui donne à votre site Web l'apparence d'une application native.

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

Adresse originale de l'article : https://www.cnblogs.com/wang3680/p/1fba762fb916d0189047085d9e14c117.html

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!