管道（|）和脱字号（^）属性选择器有什么区别？

  • Z时代
  • 2024-01-10
  • 分类：问答

在W3Schools中，它们同时声明|和^表示：选择一个 具有以指定值 的属性的元素。

那有什么区别呢？

回答：

选择元素（<h1>），其中指定属性（rel）的值以某个值（val）开头：

h1[rel^="val"] { /** formatting */ }
h1[rel^="friend"] { color: blue; }
<h1 rel="friend-external-sandwich">I'm Blue.</h1>
<h1 rel="friend2-external-sandwich">I'm Blue.</h1>
<h1 rel="external-sandwich">I'm Black.</h1>

选择一个元素（<h1>），其中指定属性（rel）的值恰好是值（val）或以该值开头并紧随其后是-（val-）：

h1[rel|="val"] { /**formatting */ }
h1[rel|="friend"] { color: red; }
<h1 rel="friend-external-sandwich">I'm Red.</h1>
<h1 rel="friend2-external-sandwich">I'm Black.</h1>

以上是 管道（|）和脱字号（^）属性选择器有什么区别？ 的全部内容， 来源链接： utcz.com/qa/409278.html

回到顶部