javascript - 如何增加 lightSlider 的高度而不考虑其内容？

Question

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

.myDiv{

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

}

当我尝试对光 slider 使用相同的方法时，它不起作用。无论我给的高度是多少， slider 都会占用 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

<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>

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