html - 如何更改下拉(下拉内容)菜单中的标题位置?
问题描述
这是我的第一个项目,想知道如何更改下拉菜单中的标题位置,就像在该站点https://www.developerfusion.com/t/csharp/forum/上一样。当您将光标移到 .NET 上时,您可以看到“技术”和“语言”位于该菜单的左侧,而“最新消息”位于右侧。我正在尝试做同样的事情,但不知道也找不到如何将标题移动到右上角的信息。谢谢你的帮助
这是我的一段代码:
.dropbtn {
color: steelblue;
padding: 6px;
font-size: 15px;
border-right: thin;
}
.dropdown {
position: relative;
display: inline;
}
.dropdown-content {
display: none;
position: absolute;
background-color: #f1f1f1;
min-width: 420px;
box-shadow: 0px 8px 56px 0px rgba(0,0,0,0.2);
z-index: 1;
}
.dropdown-content a {
color: cornflowerblue;
padding: 8px 15px;
text-decoration: none;
display: block;
}
.dropdown-content a:hover {
background-color: steelblue;
color: white;
}
.dropdown:hover .dropdown-content {
display: block;
}
.dropdown:hover .dropbtn {
background-color: midnightblue;
color: white;
}
</style>
<meta charset="utf-8">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container-fluid">
<ul class="nav navbar-nav">
<li class="dropdown">
<a href=".net" class="dropbtn">.NET</a>
<div class="dropdown-content">
<h5>Languages</h5>
<a href="csharp">C#</a>
<a href="vb.net">VB.NET</a>
<a href="fsharp">F#</a>
<h5>Technologies</h5>
<a href="azure">Azure</a>
<a href="asp.net">ASP.NET</a>
<ul style="list-style-type: none;">
<li><a href="asp ajax">ASP AJAX</a></li>
<li><a href="asp mvc">ASP MVC</a></li>
</ul>
<h5>Latest articles</h5>
</div>
</li>
解决方案
推荐阅读
- java - Java:关闭挂钩中的线程
- javascript - 获得多边形矢量乘积的函数式方法
- python - 来自其他人的值的熊猫新列
- tinyos - 在 Tinyos 中接收和发送
- nhibernate - NHibernate 选择特定列
- php - 如何在 jquery select2 laravel 中设置选定值?
- json - PowerShell:并行处理多个 API 帖子
- python - OpenCV Python激光点跟踪提取x和y坐标并将其存储到不同的变量中
- maven - 使用 spotify/docker-maven-plugin 删除 docker 镜像中的文件
- keras - 如何获取 Keras 变量的值