位置绝对与跳过父元素的第一个元素有关吗？

Question

如何使用第一个div跳过父div的位置绝对值？

<ul>
<li>
<ul class="sub-menu">
</ul>
</li>
</ul>

如何使用绝对位置关联ul，而不是li？

Answer 1

不确定你想要什么，但我想你的意思是这样的？：

ul.menu,
ul.sub-menu {
  position: relative;
  margin: 0;
  padding: 0 0;
  list-style: none;
  background: #1486e7;
}
ul.menu li {
  position: static;
  float: left;
  margin: 0 5px;
  padding: 5px;
}
ul.menu li a {
  display: block;
  padding: 5px;
  background: #fff;
}
ul.sub-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
}
ul.menu > li:hover ul.sub-menu {
  display: block;
}
.clearfix::before,
.clearfix::after {
  content: " ";
  display: table;
}
.clearfix::after {
  clear: both;
}

<ul class="menu clearfix">
  <li><a href="#">Item 1</a>
  </li>
  <li>
    <a href="#">Item 2</a>
    <ul class="sub-menu">
      <li><a href="#">Sub-Item 2-1</a>
      </li>
      <li><a href="#">Sub-Item 2-2</a>
      </li>
      <li><a href="#">Sub-Item 2-3</a>
      </li>
    </ul>
  </li>
  <li><a href="#">Item 3</a>
  </li>
  <li>
    <a href="#">Item 4</a>
    <ul class="sub-menu">
      <li><a href="#">Sub-Item 4-1</a>
      </li>
      <li><a href="#">Sub-Item 4-2</a>
      </li>
      <li><a href="#">Sub-Item 4-3</a>
      </li>
    </ul>
  </li>
</ul>

  

position: absolute;元素相对于其第一个定位（非静态）祖先元素定位

这意味着li必须是position: static;（这是默认值）

Answer 2

尝试.sub-menu ul {position: absolute;}进行绝对定位和

.sub-menu ul {position: relative;}

用于相对定位。

您可以在css文件中设置

修改

<ul class ="sub-menu">
<li>list item</li>
</ul>