Viewport
La balise meta viewport permet de définir les dimensions d'une page web. La balise permet de définir la largeur de la page, la hauteur et même le zoom sur cette page. Cette balise est utile pour l'affichage d'une page sur mobile (exemple : iPhone, iPod ...).
Utilisation
Le code suivant est à adapter (remplacer avec la valeur souhaitée) puis à insérer la balise "head" :Voici un tableau avec les attributs possible ainsi que les valeurs associées:
| Attribut | Valeurs possibles | Description |
|---|---|---|
| width | 1 à 10000 (minimum dépend du mobile) ou "device-width" | Largeur en pixel de la page web. La valeur "device-width" permet de redimensionner le site sur toute la largeur de l'écran. |
| height | 1 à 10000 (minimum dépend du mobile) ou "device-height" | Hauteur en pixel de la page web. La valeur "device-height" permet de redimensionner le site sur toute la hauteur de l'écran. |
| inital-scale | 0.1 à 10 | Profondeur initial du zoom. Une grande valeur permet de zoomer tandis qu'une petite valeur permet de dé-zoomer. Par défaut la valeur est "1.0". |
| user-scalable | "yes" (oui) ou "no" (non) | Possibilité ou non de zoomer / dé-zoomer sur la page. Valeur par défaut : "yes" |
| minimum-scale | 0.1 à 10.0 | Définir le dé-zoom minimum. La valeur par défaut est 0.25 mais peut s'ajuster selon la largeur de l'écran "width". |
| maximum-scale | 0.1 to 10.0 | Définir le zoom maximum. La valeur par défaut est 5.0 mais peut s'ajuster selon la largeur de l'écran "width" |
| target-densityDpi | "device-dpi" (pas de zoom), "medium-dpi" (zoom x1.3) ou "high-dpi" (zoom x1.5) | Modifie la densité de l'écran. Permet de zoomer pour les écrans avec une meilleure résolution (DPI). Disponible que pour Nokia actuellement Valeur par défaut : "device-dpi" |
Exemples d'utilisations
Afficher la page web seulement sur 500px de large :Partager :
Faire un lien :
