方法一掰盘、
css實現(xiàn):(此例中圖片寬高比例為1:1)
<mt-swipe?:auto="4000"?style='height:?0;padding-bottom:?100%;width:?100%;'>
????????<mt-swipe-item?style="height:?0;padding-bottom:?100%;width:?100%;"?v-for="item?in?list"?:key="item.id">
????????????<img?:src="item.img"?class="swipepic">
????????</mt-swipe-item>
??????</mt-swipe>???
就是通過padding-top或者padding-bottom實現(xiàn)延欠,高度設(shè)置為0智政。這個屬性當它的值為百分比的時候质涛,是按該元素的寬度來計算的稠歉。也就是說當設(shè)為100%的時候,其高度就等于自身的寬度汇陆,形成一個正方形怒炸。也就是說可以通過這個來設(shè)置已知尺寸比例的圖片寬度100%高度自適應(yīng)。
方法二毡代、
使用js判斷圖片的寬度得到具體數(shù)值之后阅羹,再來利用js設(shè)置圖片的高度,具體實現(xiàn)請打開百度教寂,另外請注意:用js實現(xiàn)的時候需要監(jiān)控頁面縮放變化以達到自適應(yīng)捏鱼。