Image dans une page responsive
Rocky92
Messages postés
186
Statut
Membre
-
Rocky92 Messages postés 186 Statut Membre -
Rocky92 Messages postés 186 Statut Membre -
Bonjour,
Une question toute bête, dont je n'arrive pas à trouver la réponse:
Je fais un site web que je voudrais responsive, donc je le teste sur mon iPad et mon smartphone Android. Mon iPad est de génération 4, donc avec un écran Retina de 1536 par 2048 pixels.
J'ai une page web tout ce qu'il y a de plus simple, qui intègre cette image, qui a une largeur de 700 pixels :

Sur un écran qui fait 1536 pixels de large, elle devrait tenir à l'aide dans la largeur de l'écran, or elle tient tout juste... J'ai fait un screenshot de mon iPad, ça donne ça:

Mon screenshot fait bien 1536 par 2048 pixels, conforme à la résolution de mon iPad, mais on voit bien que l'image est "grossie", 1 pixels de l'image ne correspond pas à 1 pixels de l'écran.
Pourtant elle est intégrée dans la page à l'aide du code HTML le plus simple qui soit:
Comment remédier à ce problème?
Toute aide est la bienvenue.
Merci !!
Eric
Une question toute bête, dont je n'arrive pas à trouver la réponse:
Je fais un site web que je voudrais responsive, donc je le teste sur mon iPad et mon smartphone Android. Mon iPad est de génération 4, donc avec un écran Retina de 1536 par 2048 pixels.
J'ai une page web tout ce qu'il y a de plus simple, qui intègre cette image, qui a une largeur de 700 pixels :

Sur un écran qui fait 1536 pixels de large, elle devrait tenir à l'aide dans la largeur de l'écran, or elle tient tout juste... J'ai fait un screenshot de mon iPad, ça donne ça:

Mon screenshot fait bien 1536 par 2048 pixels, conforme à la résolution de mon iPad, mais on voit bien que l'image est "grossie", 1 pixels de l'image ne correspond pas à 1 pixels de l'écran.
Pourtant elle est intégrée dans la page à l'aide du code HTML le plus simple qui soit:
<img id="imgCntnrHistory" src="../images/fs4-PC.png">
Comment remédier à ce problème?
Toute aide est la bienvenue.
Merci !!
Eric
A voir également:
- Image dans une page responsive
- Supprimer une page dans word - Guide
- Imprimer tableau excel sur une page - Guide
- Légender une image - Guide
- Image iso - Guide
- Créer une page facebook - Guide
1 réponse
J'ai moi-même trouvé la réponse à ma question...
Dans l'entête de mon HTML, j'avais la ligne:
En enlevant cette ligne, mon image retrouve une taille normale sur l'iPad et le téléphone.
Du coup, d'autres problèmes apparaissent, comme un texte trop petit, mais je vais gérer :)
Même si personne ne m'a aidé à trouver la réponse, je vous remercie quand même :)
Et si quelqu'un a des infos ou un bon tuto sur le "viewport", je suis preneur, car j'ai un peu de mal à comprendre comment ça marche.
Eric
Dans l'entête de mon HTML, j'avais la ligne:
<meta name="viewport" content="width=device-width, initial-scale=1">
En enlevant cette ligne, mon image retrouve une taille normale sur l'iPad et le téléphone.
Du coup, d'autres problèmes apparaissent, comme un texte trop petit, mais je vais gérer :)
Même si personne ne m'a aidé à trouver la réponse, je vous remercie quand même :)
Et si quelqu'un a des infos ou un bon tuto sur le "viewport", je suis preneur, car j'ai un peu de mal à comprendre comment ça marche.
Eric