Question

我如何在窗口底部对齐元素（与屏幕大小无关），但将其保持在该位置，以便在减小窗口高度（当用户更改窗口大小时）时，该元素保持在该位置位置并且在窗口中看不见？

我觉得这可能需要的不仅仅是CSS。如果可以的话，有人可以指导我正确的方向吗？

Answer 1

<div style="position: fixed; bottom: 0px; left: calc(100vw / 2 - 200px); width: 400px; text-align: center; background-color: #ff0000;">Bottom center text<br />Hello center div</div>

Answer 2

<style>
  .box {
    border: 1px solid gray;
    box-shadow: -9px -10px 10px -10px black;
    width: 200px;
    height: 200px;
    position: absolute;
    bottom: 10vh;
    right: 10vw;
  }
</style>

<div class="box"></div>

如何使用CSS在屏幕底部对齐元素？

2 个答案: