jquery - 我们如何将高度设置为 flexislider？

Question

我无法为 flexislider 设置高度。我猜这个问题与 flexislider.js 有关。还有关于响应式设计。

像这样的 FlexiSlider html:

<div class="flexslider">
  <ul class="slides">
    <li>
      <img src="http://i.imgur.com/YSVlz2Z.jpg" />
      <h2><a href"#">First Link Here</a></h2>
      <p>Some text here that could be a message</p>
      <a href="#" data-role="button" data-icon="arrow-r" data-iconpos="right">Another Link Here</a>
    </li>
    <li>
      <img src="http://i.imgur.com/YSVlz2Z.jpg" />
      <h2><a href"#">Second Link Here</a></h2>
      <p>Some text here that could be a message</p>      
    </li>
    <li>
     <img src="http://i.imgur.com/YSVlz2Z.jpg" />
     <h2><a href"#">Third Link Here</a></h2>
     <p>Some text here that could be a message</p>     
    </li>
  </ul>
</div>

我们如何解决这个问题？

谢谢

Answer 1

事实上，您可以为 .flexslider 分配一个高度，问题在于您在 .flexslider 中拥有的内容。要检查您指定的高度是否已应用，只需(临时)向您的 div 添加带有轮廓的样式，例如:

<div class="flexslider" style="outline: 1px solid red; height: 50px">
</div>

这将使您直观地阐明 div 的高度。但我想对于当前的问题，div 似乎使用了 overflow 属性，只需使用

<div class="flexslider" style="outline: 1px solid red; height: 50px; overflow: hidden">

您可以在 www.w3schools.com 了解有关溢出的更多信息