绝对位置如何在相对 div (html/css) 内改变

发布于 2024-12-10 04:33:50 字数 549 浏览 0 评论 0原文

我不知道如何表达这个问题,但我会尝试通过代码来解释

<ul>
 <li><span>1</span><li>
 <li><span>2</span><li>
 <li><span>3</span><li>
 <li><span>4</span><li>
</ul>

ul{ width:90px}
ul li{width:30px; float:left; position:relative;}
ul li:hover span{ position:absolute; width:60px;}

现在,当您将鼠标悬停在列表一上时,其跨度将覆盖列表 2,列表 2 将覆盖列表 3。一旦您将鼠标悬停在第三个列表,它的跨度将跨越 ul 元素。那么有没有办法让第三个跨度从右向左扩展呢?因此,目前跨度的起点(据我所知)是列表的左上角。有没有办法让它从右边开始。那么额外的 30px 向左扩展,而不是向右?

I didn't know how else to phrase the question, but I'll try to explain through code

<ul>
 <li><span>1</span><li>
 <li><span>2</span><li>
 <li><span>3</span><li>
 <li><span>4</span><li>
</ul>

ul{ width:90px}
ul li{width:30px; float:left; position:relative;}
ul li:hover span{ position:absolute; width:60px;}

Now, when you hover on list one, its span would cover list 2, and list 2 would cover list 3. Once you hover over the third list, its span would run over the ul element. So is there a way to make the third span expand from right to left? So at the moment the spans starting point (as I understand it) is the top-left corner of the list. Is there a way to make it start from right. So the extra 30px expand to the left, not to the right?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

东京女 2024-12-17 04:33:50

首先,你错误地关闭了 LI 标签。我执行了与你相同的代码。但是当我悬停在任何跨度上时,没有任何反应,并且它是正常且正确的。我认为你的意思是像 jquery Accordian 插件或类似的东西。也许你可以做在本期中使用 jquery 而不是 css。如果您需要其代码,请评论我。祝您好运

first,you closed the LI tag incorrectly.I execute the same code as yours.but when i hovered any span nothing happened and it is regular and correct.i think you mean something like jquery accordian plugin or something lick that.maybe you can do that with jquery instead of css in this issue.If you need its code comment me.good luck

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文