当前位置: 首页 > 面试题库 >

管道(|)和脱字号(^)属性选择器有什么区别?

东方旭东
2023-03-14
问题内容

在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>


 类似资料:
  • 本文向大家介绍css中class和id选择器有什么区别?相关面试题,主要包含被问及css中class和id选择器有什么区别?时的应答技巧和注意事项,需要的朋友参考一下 id 在部分浏览器的 js 中会直接生成同名变量; id 的唯一性,获取该 id 的 dom 时,会取同名 id 的前者; id 层叠权重非常高,1000 个 class 也覆盖不了 id 的样式; class 可以用空格给同个元素

  • 问题内容: 在jQuery 1.6.1中进行更改之后,我一直在尝试定义HTML中属性和属性之间的差异。 查看jQuery1.6.1发行说明中的列表(在底部附近),似乎可以对HTML属性和属性进行如下分类: 属性:所有具有布尔值或UA计算得出的值,例如selectedIndex。 属性:可以添加到既不是布尔也不包含UA生成值的HTML元素中的“属性”。 有什么想法吗? 问题答案: 在编写HTML源代

  • 本文向大家介绍相邻兄弟选择器、后代选择器和子选择器三者有什么区别?相关面试题,主要包含被问及相邻兄弟选择器、后代选择器和子选择器三者有什么区别?时的应答技巧和注意事项,需要的朋友参考一下 后代选择器与子选择的关系:后代选择器>子选择器。 后代选择器:包括父元素的子元素以及孙子元素(代表符号:空格) 子选择器:包括父元素的子元素(仅仅是子元素)(代表符号:>) 相邻兄弟选择器与后续兄弟选择的关系:后

  • 问题内容: 使用这种语法有什么意义 这有什么区别 问题答案: 只会选择直接成为A的子级的B(也就是说,它们之间没有其他元素)。 将选择A内的任何B,即使它们之间还有其他元素也是如此。

  • 问题内容: 在jQuery 1.6.1中进行更改之后,我一直在尝试定义HTML中属性和属性之间的差异。 查看jQuery1.6.1发行说明中的列表(在底部附近),似乎可以对HTML属性和属性进行如下分类: 属性:所有具有布尔值或UA计算得出的值,例如selectedIndex。 属性:可以添加到既不是布尔也不包含UA生成值的HTML元素中的“属性”。 有什么想法吗? 问题答案: 在编写HTML源代