Vuetify v-img会自动增长到容器的大小,而不是src的大小

  • 本文关键字:src v-img Vuetify css vue.js vuetify.js
  • 更新时间 :
  • 英文 :


v-img上的Vuetify文档说明:

v-img将自动增长到其src的大小,从而保持正确的纵横比。你可以通过高度和最大高度道具来限制这一点。

但是,它正在增长到容器的完整大小或max-height,以较小者为准。它并没有增长到其源的大小——以下示例中的图像src是256x256。

示例:https://codepen.io/nullism/pen/bGWVreK

这是Veutilify的错误,文档的问题,还是我缺少了一些属性?

提前非常感谢!

更新:看起来常规<img/>标记可以按预期工作:https://codepen.io/nullism/pen/OJmyjvw

据我所知,您希望图像的大小小于256 x 256,在这种情况下,会添加属性max width=";256〃;最大高度=";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>

最新更新