Question

似乎无法弄清楚如何在jumbotron中专门用CSS放置按钮。我使用了一些类似文本左或左拉，但它们并没有给我所需的外观。我想象它是一些简单的CSS，但我似乎无法得到它。我希望能够根据像素专门放置它。

HTML：

safe

Answer 1

要告诉你应该做什么是非常困难的，因为有一百万种方法可以放置它，我们不知道你想放在哪里？

可能的解决方案可能是使用CSS属性position: relative在jumbotron中创建容器类，然后创建一个自定义按钮类：

position: absolute;
top: 100px; (or any other number)
left: 100px;
right 100px;
bottom: 100px;

如果您只想将按钮居中，可以使用默认的TWBS类文本中心。如果它是关于从左侧或右侧稍微移动它的问题，请将margin-right / margin-left添加到按钮。

如果您想要更精确的解决方案，请提供jsfiddle或图像

Answer 2

 <div class="jumbotron jumbotron-fluid" style="margin-bottom: 0; background-color: orange; " >
            <div class="container-lg" >
              <h1 class="display-4 text-white"  >Free Access &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;Start Learning </h1>
              <p class="lead text-white">
                No account required!<br>Just Learn from Scratch absolutely free!
                <a href="index1.html"target="blank" class="btn btn-primary" style="position: relative;margin-left: 850px; margin-top: -90px; ">Start Learning</a></p>
            </div>
          </div>

如何在Jumbotron上专门定位按钮？

2 个答案: