Question

我试图隐藏＃bubble-three和＃bubble-two而不改变＃bubble-one或图像的位置。我已经尝试应用可见性：隐藏到这两个对象，但似乎这导致前两行缩小，从而将＃bubble-one和图像推到屏幕顶部。有没有办法保持自举网格，避免求助于绝对定位？下面是我的HTML。

HTML：

<div class = "row">
    <div class = "text-center">
        <h1 id="bubble-three">Title</h1>
    </div>
</div>
<div class = "row">
    <div>
        <p id="bubble-two">Some Text</p>
    </div>
</div>
<div class = "row">
    <div class = "col-xs-9">
        <p id="bubble-one"></p>
    </div>
    <div class = "col-xs-3">
        <img src = "http://via.placeholder.com/200x100" id = "filler">
    </div>
</div>

Answer 1

是的，您可以将不透明度设置为0

所以

 #bubble-three,
 #bubble-two{
     opacity: 0;
 }

这基本上会在不改变布局的情况下将这些元素隐藏起来，所以它们基本上仍然存在......它们只是看不见

在Bootstrap布局中隐藏对象而不移动其他元素

1 个答案: