在以下 HTML 中，<h4>Sign up</h4>元素被顶部栏隐藏。它不应该自动出现在顶栏下方吗？如果我添加 <br><br>在它之前，它显示正常。为什么它没有出现在顶部栏下方？
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Elephant2</title>
<!--[if lt IE 9]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap-1.0.0.min.css">
</head>
<body>
<div class="container">
<header>
<div class="topbar-wrapper" style="z-index: 5;">
<div class="topbar">
<div class="container fixed">
<h3><a class="logo" href="">Project Name</a></h3>
<nav>
<ul>
<li class="active"><a href="">Home</a></li>
<li><a href="/users/sign_up">Sign up</a></li>
<li><a href="/users/sign_in">Sign in</a></li>
</ul>
</nav>
</div>
</div>
</div>
</header>
<h4>Sign up</h4>
<form accept-charset="UTF-8" action="/users" class="user_new" id="user_new" method="post"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="✓" /><input name="authenticity_token" type="hidden" value="4PQpcNt+xUaRJOr/ZFNrNSLMOCsL/1FZlf/hso1HgKs=" /></div>
<p>
<label for="user_email">Email</label>
<div class="input">
<input id="user_email" name="user[email]" size="30" type="text" value="" />
</div>
</p>
<p>
<label for="user_password">Password</label>
<div class="input">
<input id="user_password" name="user[password]" size="30" type="password" />
</div>
</p>
<p>
<label for="user_password_confirmation">Password confirmation</label>
<div class="input">
<input id="user_password_confirmation" name="user[password_confirmation]" size="30" type="password" />
</div>
</p>
<div class="actions">
<p><button type="submit" class="btn primary">Submit</button></p>
<a href="/users/sign_in">Sign in</a><br />
<a href="/users/password/new">Forgot your password?</a><br />
</div>
</form>
</div>
</body>
</html>最佳答案
div.topbar 是 position: fixed，它脱离了正常的流，所以它不会影响后面任何内容的位置。
关于html - 为什么 H4 元素在此 HTML 中不可见？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/7130251/