Maison >interface Web >tutoriel HTML >Introduction à la compatibilité des fenêtres sur les appareils mobiles

Introduction à la compatibilité des fenêtres sur les appareils mobiles

零下一度
零下一度original
2017-07-26 17:16:242048parcourir
La fenêtre d'affichage sur les appareils mobiles est divisée en fenêtre de mise en page, fenêtre d'affichage visuelle et fenêtre idéale trois catégories,
parmi elles, la fenêtre idéale est la fenêtre la plus adaptée aux mobiles appareils, idéal La largeur de la fenêtre d'affichage est égale à la largeur de l'écran de l'appareil mobile Tant que la largeur d'un élément est définie sur la largeur de la fenêtre d'affichage idéale en CSS (l'unité est px), alors la largeur de cet élément. est la largeur de l'écran de l'appareil, c'est-à-dire que la largeur est d'un effet de 100 %.
L'importance de la fenêtre d'affichage idéale est que, quelle que soit la résolution de l'écran, les sites Web conçus pour une fenêtre d'affichage idéale peuvent être parfaitement présentés sans que les utilisateurs aient besoin de zoomer manuellement ou de barres de défilement horizontales.
Étant donné que la largeur idéale de la fenêtre d'affichage de tous les iPhones est de 320 pixels, la manière simple et grossière d'adapter la page H5 à tous les modèles d'iPhone et d'Android est la suivante : définir la fenêtre d'affichage
la balise méta viewport a été introduite pour la première fois par Apple. La société l'a introduit dans son navigateur Safari pour résoudre le problème de la fenêtre d'affichage sur les appareils mobiles. Plus tard, Android et les principaux fabricants de navigateurs ont également emboîté le pas et ont introduit la prise en charge de la méta-fenêtre. Les faits ont également prouvé que cette chose est toujours très utile. Dans les spécifications d'Apple, la méta-fenêtre a 6 attributs (appelons ces éléments dans les attributs et les valeurs de contenu), comme suit :
Définissez la largeur de la
width
width 设置layout viewport  的宽度,为一个正整数,或字符串"width-device"
initial-scale 设置页面的初始缩放值,为一个数字,可以带小数
minimum-scale 允许用户的最小缩放值,为一个数字,可以带小数
maximum-scale 允许用户的最大缩放值,为一个数字,可以带小数
height 设置layout viewport  的高度,这个属性对我们并不重要,很少使用
user-scalable 是否允许用户进行缩放,值为"no"或"yes", no 代表不允许,yes代表允许
fenêtre d'affichage de mise en page
sur un entier positif, ou sur la chaîne "width-device" initial-scale Définissez la valeur de mise à l'échelle initiale de la page, qui est un nombre pouvant contenir des décimales échelle minimaleLa valeur minimale la valeur de zoom autorisée par l'utilisateur est un nombre pouvant contenir des décimales échelle maximale La valeur de zoom maximale autorisée par l'utilisateur est un nombre, peut prendre des décimales hauteur Définir la hauteur de la fenêtre de mise en page , cet attribut n'est pas utile pour us Important, rarement utilisé évolutif par l'utilisateur Que l'utilisateur soit autorisé à zoomer, la valeur est "non" ou "oui", non signifie non autorisé, oui signifie autorisé Ces attributs peuvent être utilisés en même temps, seuls ou mélangés. Lorsque plusieurs attributs sont utilisés en même temps, simplement. séparez-les par des virgules.

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