css +号选择器

最新推荐文章于 2023-10-19 19:01:31 发布

第25点

最新推荐文章于 2023-10-19 19:01:31 发布

阅读量1.2k

点赞数

文章标签： css 选择器 +

本文链接：https://blog.csdn.net/qq_26540999/article/details/53078339

版权

<span style="font-size:18px;">html代码：</span>

<span style="font-size:18px;"><!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>+ selector</title>
  </head>

<body>
  <ul>
    <li><1/li>
    <li class="item2">2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
    
  </ul>
</body>

</html></span>

css代码

<pre name="code" class="plain"><span style="font-size:18px;"><style>
    ul > li {
      line-height: 30px;
      font-size: 20px;
    }
    
    ul > li + li {
      color: #f40;
    }
   /* ul > li.item2 + li {
      color: #f40 
    }*/
  </style></span>

<span style="font-size:14px;"> 
    <li>1</li>
    <span style="color:#330033;"><li class="item2"></span><span style="color:#ff0000;">2</span><span style="color:#330033;"></li>
    <li></span><span style="color:#ff0000;">3</span><span style="color:#330033;"></li>
    <li></span><span style="color:#ff0000;">4</span><span style="color:#330033;"></li>
    <li></span><span style="color:#ff0000;">5</span><span style="color:#330033;"></li></span></span>

这个ul>li+li 代表的意思就是ul下第一个li后面的li设置颜色

而ul>li.item2+li 则是给类名为.item2的li 的最靠近的li 设置颜色。


    <li>1</li>
    <span style="color:#330033;"><li class="item2"></span><span style="color:#330033;">2</span><span style="color:#330033;"></li>
    <li></span><span style="color:#ff0000;">3</span><span style="color:#330033;"></li>
    <li></span><span style="color:#330033;">4</span><span style="color:#330033;"></li>
    <li></span><span style="color:#330033;">5</span><span style="color:#330033;"></li></span>

第25点

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
css +号选择器

html代码： + selector 2 3 4 5 css代码 ul > li { line-height: 30px; font-size: 20px; } ul > li + li { color: #f40; }
复制链接

扫一扫