CSS如何定义才能匹配class值带空格的元素

597 阅读1分钟

我的页面元素class属性如下:

我在CSS中定义

.navigation .nav {            text-decoration: none; color: black;             border-right: solid 1px black; padding: 0 15px;        }

这个样式会修改到div class="navigation"容器下所有class属性包含nav的超链接。

可是我需要对最后一个超链接的样式做清除边框的特殊处理。最后一个超链接class="nav last",我只需要在CSS中增加这样到定义就可以匹配到

        .navigation .nav.last {            border: none;        }

这个样式定义会修改到div class="navigation"容器下所有class属性包含nav又包含last的超链接。

其他更精准点的属性选择方式有:

  • 标签 [attr = value] 表示attr属性值等于value的
  • 标签 [attr $= value]   表示attr属性值以value结尾的
  • 标签 [attr ^= value] 表示attr属性值以value开头的