javascript - Bootstrap 隐藏元素需要放置

Question

我正在使用 Bootstrap，并且在页面底部包含了一个导航栏。 但是 notification bar 元素(看注释 - 它是带有 id warning 的 div 元素。

通知栏可以改变它的可见性。但是，当可见性“折叠”时，div 仍会占用所有空间。

我的代码:

 <div class="navbar navbar-default navbar-fixed-bottom">

    <!-- notification bar element can change visibility -->
    <div class="row"  id="warning" style="visibility: hidden;">
        <h2>Bottom Notification</h2>
        <small>Timestamp</small>
        <h3>This is a message.</h3>
    </div>
    <!-- -->

    <!-- element is static - can't change visibility -->
    <div class="container row">
        <p class="navbar-text pull-left">© 2016 - xxxx</p>
    </div>
</div>

如何更改它，以便在隐藏可见性时 div 不会占用任何空间？

Answer 1

没错。 visibility 可以看作是不透明度...所以元素在那里，但隐藏时不透明度为零。

如果你不想让它使用这个地方，而是使用display:

<div class="row"  id="warning" style="display: none;">