Ajuster div à la taille de l'image

normalement, j'ai utilisé pour ajuster une image dans un div en fonction de sa largeur et de la hauteur d'attributs à l'aide background-image. Maintenant, j'ai exactement le contraire question.

Ce que j'essaie de faire est d'ajuster la taille de la div de l'image, mais avec un maximum de largeur et de hauteur. disons que si l'image est de 200x200, la div doit être adaptée à cette taille, mais si l'image dépasse le 300x300, il doit être limitée.

Aucune idée de comment dois je faire?

  • Confirmant, l'image de fond ou de la balise img?
  • avec background-image
InformationsquelleAutor domoindal | 2012-06-21
  1. 1

    Vous pouvez appliquer la max-width et max-height des propriétés de style pour l'élément de l'image.

    En fonction de ce que vous devez faire avec l'élément conteneur, cela peut fonctionner:

    <div>
    <div style="position: absolute;">Element content here</div>
    <img src="image.png" style="max-width: 300px; max-height: 300px;" />
</div>
    • Pouvez-vous changer de "position: absolute", de sorte que vous obtenez une image centrée?
    InformationsquelleAutor Niet the Dark Absol
  2. 0

    Quelle est la structure de votre page?

    Je suppose que vous utilisez quelque chose comme ceci:

    <div id="container">
    <img src="img.jpg" />
</div>

<style>
    #container {
        display: inline-block;
        border:1px solid blue;
        max-width:300px;
        max-height:300px;
    }
</style>
    InformationsquelleAutor meneerfab