html - 如何在现有下拉菜单中编写额外的下拉菜单选项？

Question

我目前正在重新启动我的博客 - www.blankesque.com - 它托管在 Blogger 上，理想情况下希望对博客的导航进行更改。我开始了解到 Blogger 在编码方面的多功能性有限。但我希望得到一些帮助，以解决我在除这一次以外的其他场合遇到的问题。

我已经有一个带有三个选项卡的悬停导航栏，其中两个选项卡有下拉选项。 “Blankesque”——位于屏幕的左上角——就是这样一个选项卡。我想在此下拉菜单中添加另一个下拉菜单选项。

我上面提到的特定选项卡的当前编码如下:

<ul>
<li><a href='#'>Blankesque</a>
<ul>
<li><a href='http://www.blankesque.com'>Home</a></li>
<li><a href='http://www.blankesque.com/p/about-blankesque-blog.html'>About</a>      </li>
<li><a href='http://www.blankesque.com/p/disclaimer-policy_13.html'>Policies</a></li>
<li><a href='#'>Social</a>
<ul>
<li><a href='http://www.twitter.com/blankesque'>Twitter</a></li>
<li><a href='http://www.instagram.com/blankesque'>Instagram</li></a>
<li><a href='http://www.pinterest.com/blankesque'>Pinterest</li></a>

我已尝试对我正在寻找的外观进行编码，但是从上面的编码中您可以看到“社交”选项卡的其他下拉菜单选项与其他选项一样显示为连续的。理想情况下，我希望 Twitter、Pinterest、Instagram 和 Bloglovin 链接仅在鼠标悬停在上方或鼠标单击“社交”一词时出现。

在最简单的形式中，我希望在现有的下拉菜单选项中有一个下拉菜单选项。

如果您对此问题有任何帮助，我们将不胜感激。提前谢谢你。

伊朗

Answer 1

您可以在 Bootstrap demo page 上了解更多信息.在这个网站上有下拉菜单的例子。复制提供的示例，进入开发人员工具 (F12) 并检查您要更改的元素(您可以右键单击它并点击 Inspect element)。将所选 li 的内容替换为您复制的代码。

如果您不介意使用 BOOTSTRAP，这应该可以帮助您找到问题的解决方案。