个人中心
文章发布
退出
作者热门文章
- android - 多次调用 OnPrimaryClipChangedListener
- android - 无法更新 RecyclerView 中的 TextView 字段
- android.database.CursorIndexOutOfBoundsException : Index 0 requested, 光标大小为 0
- android - 使用 AppCompat 时，我们是否需要明确指定其 UI 组件(Spinner、EditText)颜色
27
4
这就是我想要的导航栏，如:http://themediaoctopus.com/social-media/nostalgic-approach-advertising
如何改变<li>的完整颜色什么时候悬停或选择？关于如何在这些按钮之间使用这些分隔符有什么想法吗？
选择操作不起作用，为什么？我在特定页面上，导航栏上的那个按钮没有突出显示。为什么以及如何做？
这是悬停时我当前的导航栏:
这是我的 HTML :
<body>
<nav>
<ul>
<li><a href="index.html">HOME</a></li>
<li><a href="how_it_works.html">HOW IT WORKS</a></li>
<li><a href="get_it.html">GET IT</a></li>
<li><a href="what_you_can_do.html">WHAT YOU CAN DO</a></li>
<li><a href="about.html">ABOUT</a></li>
</ul>
</nav>
</body>
这是我的 CSS :
body {
color : #F9F9F9;
}
nav {
background-color: #26AD60;
margin: 10px 10px 0px 10px;
}
nav ul {
margin: 0px;
list-style-type: none;
padding: 15px 0px 15px 0px;
}
nav ul li {
display: inline;
padding: 5px 10px 5px 10px;
}
nav ul li a:link, nav ul li a:visited {
color: #F9F9F9;
border-bottom: none;
font-weight: bold;
text-decoration: none;
}
nav ul li a:active {
background-color: #1C8148;
text-decoration: none;
}
nav ul li:hover {
background-color: #1C8148;
color: #F9F9F9;
}
最佳答案
添加这个:
padding: 15px 10px 15px 10px;
到你的 nav ul li:hover{ CSS
fiddle :http://jsfiddle.net/39Lzp/
为了根据您所在的页面突出显示该元素，您可以向其添加一个类并相应地设置该类的样式。然后，在每个不同的 HTML 文件中，将该类添加到相应的元素。例如，index.html 看起来像这样:
<li class="current"><a href="index.html">HOME</a></li>
<li><a href="how_it_works.html">HOW IT WORKS</a></li>
但是 how_it_works.html 看起来像这样:
<li><a href="index.html">HOME</a></li>
<li class="current"><a href="how_it_works.html">HOW IT WORKS</a></li>
现在，对于边框，您需要做的就是像这样使用 border 属性:
nav ul li {
border-left: 1px dashed white;
}
nav ul li:first-of-type {
border-left: none;
}
此外，为了使边框跨越导航栏的整个高度，请更改:
nav ul li {
display: inline;
padding: 5px 10px 5px 10px;
}
对此:
nav ul li {
display: inline;
padding: 15px 10px 15px 10px;
}
此外，为了将来引用，您在这里有 3 个单独的问题。下次，将您的问题分解为更简洁的内容，您会发现自己在 SO 上得到了更好的答复。
关于html - 悬停或选择时如何在导航栏中选择完整的 <li> 元素？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22719451/
27
4
0
我试图找到在庞大的代码库中创建 NaN 的位置。是否有一些编译器标志或我可以用来在 NaN 上 panic 的东西，这样我就可以找到它在哪一行？ 最佳答案 没有编译器标志。你能做的最好的事情就是把你的
A类 class ClassA { @Autowired class ClassB; } 类配置: @Configuration class TestConfi
我是一名统计学研究生，经常使用 R。我熟悉其他编程环境中的 OOP。我什至在各种定义用于存储数据的新类的统计包中看到了它的使用。 在我研究生生涯的这个阶段，我通常会为一些类作业编写一些算法——一些接收
我想要两个不同的网络摄像头视频输出，一个是普通的网络摄像头镜头，另一个是它的“镜像”版本。 cv2可以吗？ import time, cv2 video=cv2.VideoCapture(0) a=0
我创建了一个可以通过两种方式过滤的图库。一个通过单击按钮，另一个通过搜索过滤器。过滤器工作完美，除了当 div 隐藏在过滤器上时，其余显示的 div 不会彼此相邻 float 。 这是过滤前的样子:
我们作为一个 4 人团队工作，我们的项目部署在 openshift我们使用 git 存储库 进行提交、推送和 pull 。当有人提交更多更改时，其他人必须 pull 它以在我们的系统中进行更新。但是从
我正在尝试扩展自动完成功能，以便在选择某个项目时显示辅助标签。例如，给定显示项目的自动完成功能，项目名称将显示在包含代码的输入框旁边的 span 标记中。 查看自动完成源代码，我发现过滤值的下拉列表是
我有一个包含歌曲、艺术家和专辑实体的核心数据。 歌曲有可选的一对一关系艺术家到艺术家实体和专辑到专辑实体这两个实体都与 Song 实体具有反向关系。 相册有可选的一对一关系艺术家到艺术家实体和可选的一
XmlSerializer正在调用 IList.Add()在我的课上，我不明白为什么。 我有一个自定义类(层次结构中的几个类之一)，其中包含我使用 XmlSerializer 与 XML 相互转换的数
我们在 Web 应用程序中定义了此事件，它创建了一个名为 timelineEventClicked 的自定义触发器 canvas.addEventListener('click', function
有大量资源可用于使用 Swift(可达性)检查有效的 Internet 连接，以及在进行 API 调用时检查 httpResponse 的 statusCode 的方法，但是检查和处理这些的“正确”方
谁能告诉我是否可以在 Controller 规范中 stub params[] 值，以便 Controller 接受 stub 值作为 View 中的实际 params[] 值。 例如，我的观点有一个
我的问题是没有在 UserControl 中连接 DependencyProperties。这不是问题。当我将 UserControl 中的按钮绑定(bind)到 UserControl 的 Depe
如何#define 路径 L"C:\Windows\System32\taskmgr.exe"来处理宽字符 #define TASK_MGR "C:\\Windows\\System32\\taskm
我正在尝试使用 Jasmine 和 Sion 编写单元测试，但是在使用 RequireJs 加载模块时我很难找到以下等效项: sinon.stub(window, "MyItemView"); 使用
我有一个包含三个 div 的示例页面，如下所示: 当浏览器大小达到 md 点并且第二个 div 高于第一个 div 时，第三个 div 开始在第一个的右侧
我在 C++ 端有 CString cs，在 C# 端有 IntPtr ip，它通过编码(marshal)处理机制包含 cs 的值。 然后，我只需将需要的字符串作为 Marshal.PtrToStri
我是一名优秀的程序员,十分优秀！