为什么在body标签下只有li标签能够被:only-of-type选中?

<!DOCTYPE html>
<html lang="en">
<head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Document</title>
      <style>
           li:only-of-type{background: red;}
      </style>
</head>
<body>
      
            <li></li>
            <div></div>
            <p></p>
            <ul></ul>
      
</body>
</html>

 

因为你别的标签里没有填充内容,宽高为零,没有办法显示背景色

因为你只指定了li标签

因为你设置li的样式啊

这与你上个问题一样啊。
当div、p、ul中没有内容时高度默认为0,看不见。
只有li没有内容时高度默认不为0,看得见。
 

你换成p也会被选中

<!DOCTYPE html>


<html lang="en">


<head>


      <meta charset="UTF-8">


      <meta name="viewport" content="width=device-width, initial-scale=1.0">


      <title>Document</title>


      <style>


           li:only-of-type{background: red;}
           p:only-of-type{background: red;}

      </style>


</head>


<body>


      


            <li>cccc</li>


            <div>sdsafasfsf</div>


            <p>fggsdfsafsadf</p>


            <ul>afsfsdfsfsfds</ul>


      


</body>


</html>

这样就是设置了 li和p的效果就是