Question

我可以使用以下方法使div高度适合屏幕：

.myDiv{

 position: fixed;
         top: 0;
         left: 0;
         bottom: 0;
         right: 0;
         overflow: auto;
         background: lime; /* Just to visualize the extent */

}

当我尝试使用相同的光滑块时，它不起作用。无论我给出的高度如何，滑块都会占据div内容的高度，但不会覆盖整个屏幕。

lightSlider代码：

<div data-role ="content">
            <ul id="light-slider">
               <li>
                    <div align="center">
                        <img src="img/Welcome to.png" width="100" height="10" />
                    </div>
                    <div align="center">
                        <img src="img/scrup.png" width="200" height="250" />
                    </div>
                    <div align="center">
                        <img src="img/Dots.png" width="80" height="10" />
                    </div>
                </li>
              </ul>
         </div>

Answer 1

＆＃13;

<div data-role ="content" class="a">
            <ul id="light-slider" class="a">
               <li>
                    <div align="center">
                        First div
                    </div>
                    <div align="center">
                        Second div
                    </div>
                    <div align="center">
                        Third div
                    </div>
                </li>
              </ul>
         </div>
<style>
.a{

 position: absolute;
         top: 0;
         left: 0;
         bottom: 0;
         right: 0;
         background: lime; /* Just to visualize the extent */

}
</style>

＆＃13;

正如freestock评论的那样，你需要有一个绝对或固定的位置。绿色现在覆盖整个页面，列表点显示在角落。此外，您应该删除自动溢出。

如何增加lightSlider高度而不管其内容如何？

1 个答案: