gpt4 book ai didi

html - 节 id 和类定义覆盖容器高度

转载 作者:行者123 更新时间:2023-11-28 05:47:24 30 4
gpt4 key购买 nike

早上好伙计们,这只是我在这里的第二个问题,所以请耐心等待我和我的最低要求:

我刚刚写了这篇冗长的消息,说明如何将 IDclass 命令放在 section 而不是 容器中,以及为什么该部分突然覆盖了我的 css 高度样式。然后我想为什么不用 .在 CSS 文件中,瞧,它再次起作用了。

但是,我知道有一个新问题。我有一个固定顶部的 Bootstrap 导航栏,当我单击名为 Intro 的第 2 部分时,页面仅向下滚动几个像素以显示第一行文本。我原本打算让网站显示整个介绍容器。有什么建议吗?

我希望这是有道理的:

<body id="page-top">
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container" id="navigation">
<div class="row">
<ul class="nav navbar-nav">
<li class="nav-item">
<a class="nav-link" href="#page-top">Home</a>
</li>
</ul>
<ul class="nav navbar-nav">
<li class="nav-item">
<a class="nav-link" href="#intro">Intro</a>
</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="signup.php"><span class="glyphicon glyphicon-user"></span> Sign Up</a></li>
<li><a href="#login"><span class="glyphicon glyphicon-log-in"></span> Login</a></li>
</ul>
</div>
</div>
</nav>

<section id="intro" class="intro-section">
<div class="container">
<div class="row">
<div class="col-md-10 col-md-push-1">
<h1>Welcome to TestZat</h1>

Lorem....
</div>
</div>
</div>
</section>

<section id="login" class="login-section">
<div class="container">
<div class="row">
<div class="col-md-10 col-md-push-1">
<h1>Finde das Login script hier</h1>
</div>
</div>
</div>
</section>

<section id="contact" class="contact-section">
<div class="container" id="contact-section">
<div class="row">
<div class="col-md-10 col-md-push-1" id="contact">
Section content TBD
</div>
</div>
</div>
</section>

最佳答案

现在它可以正常工作了...只需从容器中删除 id。

    <body id="page-top">
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div id="navigation">
<div class="row">
<ul class="nav navbar-nav">
<li class="nav-item">
<a class="nav-link" href="#page-top">Home</a>
</li>
</ul>
<ul class="nav navbar-nav">
<li class="nav-item">
<a class="nav-link" href="#intro">Intro</a>
</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="signup.php"><span class="glyphicon glyphicon-user"></span> Sign Up</a></li>
<li><a href="#login"><span class="glyphicon glyphicon-log-in"></span> Login</a></li>
</ul>
</div>
</div>
</div>
</nav>

<section id="intro" class="intro-section">
<div class="container">
<div class="row">
<div class="col-md-10 col-md-push-1">
<h1>Welcome to TestZat</h1>

Lorem....
</div>
</div>
</div>
</section>

<section id="login" class="login-section">
<div class="container">
<div class="row">
<div class="col-md-10 col-md-push-1">
<h1>Finde das Login script hier</h1>
</div>
</div>
</div>
</section>

<section id="contact" class="contact-section">
<div class="container" id="contact-section">
<div class="row">
<div class="col-md-10 col-md-push-1" id="contact">
Section content TBD
</div>
</div>
</div>
</section>

关于html - 节 id 和类定义覆盖容器高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37524337/

30 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com