Question

请运行以下代码段：

https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css

<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />  
<div class="navbar navbar-default navbar-fixed-top" role="navigation">
    <div class="navbar-header">
        <a class="navbar-brand" href="#">
            <span class="glyphicon glyphicon-home"></span>
        </a>
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
    </div>
    <div class="navbar-collapse collapse">
        <ul class="nav navbar-nav navbar-right">
            <div class="navbar-form">		
                <button>Sign in</button>
            </div>
        </ul>
    </div>
</div>
<div data-momentum="">
    <div class="page">
       <div class="list-group">
            <a class="list-group-item" href="#">First link</a>
            <a class="list-group-item" href="#">Second link</a>
            <a class="list-group-item" href="#">Third link</a>
            <a class="list-group-item" href="#">Last link</a>
        </div>
    </div> 
</div>

请注意，第一个链接完全隐藏在导航栏下。

我如何编辑HTML / CSS以便永远不会隐藏内容？（即使导航栏的高度增加）

Answer 1

使用此css .page{margin-top:50px}

Answer 2

原因是你的List<ProductAttributeXML>元素是从文档边距开始的，我的意思是，它是list-group所以逻辑上位于它之下。广告在你的CSS中：

margin-top = 0px;

我注意到高度值可能会改变，可能取决于设备或显示值...确保为每种情况赋予它一个合适的值......

在Navbar下部分隐藏的内容

2 个答案: