Le titre est réécrit comme suit : Le v-img de Vuetify s'ajuste automatiquement en fonction de la taille du conteneur, et non en fonction de la taille du src.

Question

La documentation de Vuetify sur v-img

v-img se redimensionnera automatiquement en fonction de la taille de son src, en conservant le rapport hauteur/largeur correct. Vous pouvez limiter la taille en utilisant les propriétés height et max-height.

Cependant, il se redimensionnera automatiquement en fonction de la taille du conteneur ou de la taille de max-height, selon la valeur la plus petite. Il ne se redimensionne pas en fonction de la taille du fichier source - dans l'exemple ci-dessous, la taille src de l'image est de 256 x 256.

Exemple : https://codepen.io/nullism/pen/bGWVreK

Est-ce un bug dans Veutify, ou y a-t-il un problème avec la documentation, ou est-ce qu'il me manque une propriété ?

Merci beaucoup pour votre aide !

Update : il semble que la balise fonctionne comme prévu : https://codepen.io/nullism/pen /OJmyjvw

Answer 1

D'après ma compréhension, vous souhaitez que la taille de l'image soit inférieure à 256 x 256, vous pouvez alors ajouter l'attribut max-width="256" max-heigth="256"

<d id="app">
  <v-app id="inspire">
    <v-main>
      <v-container>
        <v-card>
          <v-card-text>
            <v-img max-width="256" max-heigth="256"
              src="https://www.redditstatic.com/icon.png"
            ></v-img>
          </v-card-text>
        </v-card>
      </v-container>
    </v-main>
  </v-app>
</div>