emo_lgy 2022-01-20 14:29 采纳率: 66.7%
浏览 58
已结题

第二个li标签父元素不是ul吗 为什么列表1没有变红

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .biao:first-child{
            color: red;
        }
    </style>
</head>
<body>
    <ul>
        <li>列表1</li>
        <li class="biao">列表2</li>
        <li>列表3</li>
        <li>列表4</li>
        <li>列表5</li>
    </ul>
</body>
</html>

img

  • 写回答

5条回答 默认 最新

  • 归来巨星 前端领域新星创作者 2022-01-20 14:55
    关注

    使用:first-child伪类时一定要保证前面没有兄弟节点,或者用一个div包裹住

    img

    <!DOCTYPE html>
    <html lang="en">
      <head>
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Document</title>
        <style>
          .biao:first-child {
            color: red;
          }
        </style>
      </head>
      <body>
        <ul>
          <!-- <li>列表1</li> -->
          <li class="biao">列表2</li>
          <li>列表3</li>
          <div>
            <li class="biao">被div包裹住的li</li>
          </div>
    
          <li>列表5</li>
        </ul>
      </body>
    </html>
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
查看更多回答(4条)

报告相同问题?

问题事件

  • 系统已结题 1月28日
  • 已采纳回答 1月20日
  • 修改了问题 1月20日
  • 修改了问题 1月20日
  • 展开全部

悬赏问题

  • ¥15 安卓adb backup备份应用数据失败
  • ¥15 eclipse运行项目时遇到的问题
  • ¥15 关于#c##的问题:最近需要用CAT工具Trados进行一些开发
  • ¥15 南大pa1 小游戏没有界面,并且报了如下错误,尝试过换显卡驱动,但是好像不行
  • ¥15 没有证书,nginx怎么反向代理到只能接受https的公网网站
  • ¥50 成都蓉城足球俱乐部小程序抢票
  • ¥15 yolov7训练自己的数据集
  • ¥15 esp8266与51单片机连接问题(标签-单片机|关键词-串口)(相关搜索:51单片机|单片机|测试代码)
  • ¥15 电力市场出清matlab yalmip kkt 双层优化问题
  • ¥30 ros小车路径规划实现不了,如何解决?(操作系统-ubuntu)