CSS如何讓li標(biāo)簽不隨？

在CSS中，我們可以通過(guò)設(shè)置position屬性為relative或absolute來(lái)讓li標(biāo)簽不隨其他元素移動(dòng)。

我們可以給li標(biāo)簽添加一個(gè)新的class，比如static-li，然后在CSS中設(shè)置該class的position屬性為relative或absolute，這樣，li標(biāo)簽就會(huì)脫離文檔流，不再隨其他元素移動(dòng)。

我們可以給li標(biāo)簽添加以下CSS樣式：

.static-li {
  position: relative; /* 或者使用absolute */
}

在HTML中給需要固定的li標(biāo)簽添加static-li類：

<ul>
  <li class="static-li">這是不隨其他元素移動(dòng)的li標(biāo)簽</li>
  <li>這是隨其他元素移動(dòng)的li標(biāo)簽</li>
</ul>

這樣，***個(gè)li標(biāo)簽就不會(huì)隨第二個(gè)li標(biāo)簽移動(dòng)了。

需要注意的是，使用position: absolute會(huì)將元素從文檔流中移除，并相對(duì)于其***近的定位祖先（如果存在）進(jìn)行定位，如果沒(méi)有定位祖先，則會(huì)相對(duì)于初始包含塊進(jìn)行定位，在使用position: absolute時(shí)，需要謹(jǐn)慎考慮其影響。