Red de conocimiento informático - Aprendizaje de programación - carrusel mintui: configuración de imagen 100, altamente adaptable

carrusel mintui: configuración de imagen 100, altamente adaptable

Método 1,

implementación de CSS: (en este ejemplo, la relación ancho-alto de la imagen es 1:1)

lt; auto=" 4000"?style='altura:?0;padding-bottom:?100;ancho:?100;'gt;

lt;mt-swipe-item?style="altura:? 0;relleno -bottom: ?100; ancho: ?100; "?v-for="item?in?list"?:key="item.id"gt;

lt; img?: src=" item.img"?class="swipepic"gt;

lt;/mt-swipe-itemgt;

?lt;/mt-swipegt;

Se logra mediante padding-top o padding-bottom, y la altura se establece en 0. Esta propiedad, cuando su valor es un porcentaje, se calcula en función del ancho del elemento. Es decir, cuando se establece en 100, su altura es igual a su propio ancho, formando un cuadrado. En otras palabras, puede usar esto para establecer el ancho 100 y el alto de la imagen con una relación de tamaño conocida para que sea adaptable.

Método 2.

Use js para determinar el ancho de la imagen para obtener el valor específico y luego use js para establecer la altura de la imagen. Para una implementación específica, abra. Baidu. También tenga en cuenta: se implementa con js. A veces es necesario monitorear los cambios de escala de la página para lograr la adaptación.