Html 如何更改容器高度以匹配图像高度?
我一直在使用Foundaiton轨道图像滑块,发现它很棒。现在我的身高有问题 我在图库中有一些图像比其他图像高得多,因此包含图库的容器设置为“最高”图像的高度。是否有任何方法可以更改它,以便容器根据其显示的当前图像的高度调整其高度 代码如下:Html 如何更改容器高度以匹配图像高度?,html,css,height,zurb-foundation,orbit,Html,Css,Height,Zurb Foundation,Orbit,我一直在使用Foundaiton轨道图像滑块,发现它很棒。现在我的身高有问题 我在图库中有一些图像比其他图像高得多,因此包含图库的容器设置为“最高”图像的高度。是否有任何方法可以更改它,以便容器根据其显示的当前图像的高度调整其高度 代码如下: <div class="slideshow-wrapper preloader"> <ul data-orbit data-options="animation:fade;
<div class="slideshow-wrapper preloader">
<ul data-orbit data-options="animation:fade;
pause_on_hover:false;
animation_speed:500;
timer_speed: 4000;
navigation_arrows:true;
slide_number: false;
swipe: true;
bullets:false;">
<li>
<img src="img/jpg/weapon-wall.jpg" alt="Armoury Tromp l'oeil">
</li>
<li>
<img src="img/jpg/vikings.jpg" alt="Vikings attacking from the sea mural">
</li>
<li>
<img src="img/jpg/chariot.jpg" alt="Ancient chariot Trompe l'oeil">
</li>
<li>
<img src="img/jpg/egypt.jpg" alt="Karen specialises in Trompe l'oeil, Egypt">
</li>
<li>
<img src="img/jpg/army.jpg" alt="army Trompe l'oeil">
</li>
</ul>
谢谢 在您的情况下,我认为在css文件中添加以下代码就足够了:
.orbit-slides-container{
height: auto !important;
}
.orbit-container .orbit-slides-container li.active{
position:static;
}
我希望这有帮助我找到了一个解决方案,可以解决轨道滑块的自动高度问题
.orbit-slides-container{
height: 100% !important;
}
.orbit-container .orbit-slides-container li.active{
position:relative;
}
我希望有帮助
.orbit-slides-container{
height: 100% !important;
}
.orbit-container .orbit-slides-container li.active{
position:relative;
}