如何让侧边菜单保持卡住状态,以便导航选项卡始终保持在顶部并且不随页面滚动
如何让按钮在悬停
时更改背景颜色?
问题是只有文本改变背景颜色
或只有一小部分
<head>
<title>Århus Gastronomi</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="frontpage" class="content">
<div id="sidebar">
<ul id="navbar">
<li class="navitem"><a href="#">Kat</a></li>
<li class="navitem"><a href="#">Kat</a></li>
<li class="navitem"><a href="#">Kat</a></li>
<li class="navitem"><a href="#">Kat</a></li>
</ul>
</div>
<p>Another item</p>
</div>
<div id="page2" class="content">
<p>This is page 2</p>
</div>
</body>
最佳答案
将 position:fixed;
添加到您的 #sidebar
您可能还想添加以下内容:
.content {margin-left: 10%;}
像这样重组你的html,将导航放在第一个内容部分之外::
<body>
<div id="sidebar">
<ul id="navbar">
<li class="navitem"><a href="#">Kat</a></li>
<li class="navitem"><a href="#">Kat</a></li>
<li class="navitem"><a href="#">Kat</a></li>
<li class="navitem"><a href="#">Kat</a></li>
</ul>
</div>
<div id="frontpage" class="content">.......
这将使您的内容不会位于您拥有的导航后面。
关于html - 卡住/粘边导航,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33343729/