<div>如何扩展其<li>父元素的长度？

Question

我是网络开发的新手，最近我一直在练习一些基本的HTML，CSS和Javascript（jQuery），我正在对一些网站进行逆向工程以练习技能。但是，我遇到了一个令我困扰好几个小时的问题。这是一个问题：

我想制作一个看起来像第一张照片的导航栏，当您将鼠标悬停在“运动”图标上时，下拉列表会显示。正如你在第二张图片中看到的那样，它是一个“div-in-li”HTML（所以它是drop-div显示），我试图做同样的事情，但是，div始终保持与它的父元素 - li，是否有人知道如何保持“li”保持其长度并使其中的“div”扩展超出“li”元素的限制???? 任何解决方案都很好，无论是CSS还是Javascript ......

下拉“div”包含“ul”和3张图片

“div”-in-“li”元素

Answer 1

您可以将li元素定位为absolute或float。现在，li被定位为块级别并且将包围div。