html - 如何在 Bootstrap 中叠加？

Question

我正在使用 bootstrap，我有一个 anchor 标记一些文本，我想将其覆盖在另一个文本区域的一 Angular 。问题是， Bootstrap 列正在浪费空间。下面是 id 现在正在做的事情，突出显示了 div，下面是我希望文本如何流动:

当前

<div id="mainWrapper" class="wrapper">
    <div class="content-main">
        <div class="container-fluid">
            <div class="row">
                <div class="col-xxs-12 col-xs-10">
                    <p>Chuck Norris challenged Spain to a football match and won Chuck Norris can win a game of Connect Four in only three moves. Chuck Norris does not sleep. He waits. The Great Wall of China was originally created to keep Chuck Norris out. It failed miserably, Chuck Norris is the reason why Waldo is hiding, Chuck Norris drives an ice cream truck covered in human skulls. When Chuck Norris went to Vegas, Sinatra sang "Your Way.", Remember the Soviet Union? They decided to quit after watching a DeltaForce marathon on Satellite TV Chuck Norris counted to infinity - twice. </p>
                </div>
                <div class="col-xxs-12 col-xs-2 semi-transparent">
                    <a html="www.google.com">Spanish</a>
                </div>
            </div>
        </div>
    </div>
</div>

所需的选项 1(包装)

所需的选项 2( float 在顶部)

执行此操作的最佳方法是什么？

Answer 1

Bootstrap 有一个用于关闭按钮的类，恰好在您想要的顶部。可能会有用。像这样使用它:

<div class="col-xxs-12 col-xs-10">
    <div class="close">
        <a html="www.google.com">Spanish</a>
    </div>
    <p>Chuck Norris challenged Spain to a football match and won Chuck Norris can win a game of Connect Four in only three moves. Chuck Norris does not sleep. He waits. The Great Wall of China was originally created to keep Chuck Norris out. It failed miserably, Chuck Norris is the reason why Waldo is hiding, Chuck Norris drives an ice cream truck covered in human skulls. When Chuck Norris went to Vegas, Sinatra sang "Your Way.", Remember the Soviet Union? They decided to quit after watching a DeltaForce marathon on Satellite TV Chuck Norris counted to infinity - twice. </p>
</div>

您可能可以向它添加另一个类来覆盖它。