首頁 > web前端 > html教學 > html如何選擇li的偶數列

html如何選擇li的偶數列

醉折花枝作酒筹
發布: 2023-01-05 16:10:57
原創
3710 人瀏覽過

html中可以使用「:nth-of-type()」選擇器來選擇li的偶數列,語法「li:nth-of-type(even){}」。 “:nth-of-type(n)”選擇器會符合父元素特定類型的子元素,當值為even時,表示符合下標是偶數的元素。

html如何選擇li的偶數列

本教學操作環境:windows7系統、CSS3&&HTML5版、Dell G3電腦。

可以用li:nth-of-type(even) {......}來選擇li的偶數列

實例:

<!DOCTYPE html>
<html>
  <head lang="en">
    <meta charset="UTF-8" />
    <title></title>
    <style>
      #Ulist li:nth-of-type(even) {
        background: royalblue;
      }
    </style>
  </head>
  <body>
    <ul id="Ulist">
      <li>1</li>
      <li>2</li>
      <li>3</li>
      <li>4</li>
      <li>5</li>
      <li>6</li>
    </ul>
  </body>
</html>
登入後複製

效果:

html如何選擇li的偶數列

推薦學習:html影片教學

以上是html如何選擇li的偶數列的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
css
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板