我使用了p_galleria of prime并设置了以下属性:
<p-galleria [images]="productImages"
panelWidth="560"
panelHeight="313"
autoPlay="false"
showFilmstrip="false"
id="product-galley"
showCaption="false">
</p-galleria>
我还为“渲染图像”面板添加了一个样式:
.ui-panel-images {
/*height: inherit !important;
width: inherit !important;*/
/*max-height: inherit !important;
height: initial;
max-width: inherit !important;
width: initial;*/
max-width: 100%;
max-height: 100%;
width:auto;
height:auto;
}
但图像总是在容器中拉伸,我希望它在比例上固定。在面板中央。
有什么办法改变风格吗?
也许与此无关,但我把这个画廊包装成
引导模式。
最佳答案
使用PrimingV6.0.0,我将其添加到我的CSS中,使图像在保持纵横比的情况下自行调整大小,以匹配P-galleria容器的尺寸。
.ui-panel-images {
width : 100%;
height : 100%;
object-fit : contain;
}