如何使按钮 alignment 在 css 中响应？

Question

我想把按钮放在左下角。 alignment 应该有响应。 下面是我的 html 代码：

 .third-banner { /*background-image: url("banner3.PNG");*/ background-image: url("banner3new.JPG"); background-size: 100%; background-repeat: no-repeat; height: 100%; width: 90%; }.banner-btn { border-radius: 17px; color: white; margin-top: 600px; margin-right: 350px; font-size: 23px; }.banner-btn:hover { background-color: #1492ed; border-block-color: #1492ed; }

 <center> <div class="third-banner"> <a href="#" class="btn btn-danger banner-btn">LEARN MORE</a> </div> </center>

Answer 1

 .third-banner { background-image: url("https://picsum.photos/id/20/800/600"); background-size: 100%; background-repeat: no-repeat; height: 100vh; width: 90%; }.banner-btn { position: absolute; bottom: 10px; left: 10px; border-radius: 17px; color: white; font-size: 23px; }.banner-btn:hover { background-color: #1492ed; border-block-color: #1492ed; }

 <div class="third-banner"> <a href="#" class="btn btn-danger banner-btn">LEARN MORE</a> </div>

如果你 position:absolute 你的按钮不在相对的 div 中，它将是 body 的绝对值。

Answer 2

给父容器 position:relative 它会起作用