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

相邻兄弟选择器、后代选择器和子选择器三者有什么区别?

姬英武
2023-03-14
本文向大家介绍相邻兄弟选择器、后代选择器和子选择器三者有什么区别?相关面试题,主要包含被问及相邻兄弟选择器、后代选择器和子选择器三者有什么区别?时的应答技巧和注意事项,需要的朋友参考一下

后代选择器与子选择的关系:后代选择器>子选择器。
后代选择器:包括父元素的子元素以及孙子元素(代表符号:空格)

子选择器:包括父元素的子元素(仅仅是子元素)(代表符号:>)

相邻兄弟选择器与后续兄弟选择的关系:后续兄弟选择>相邻兄弟选择器
相邻兄弟选择器:紧跟在目标元素后面的第一个兄弟元素(代表符号:+)

后续兄弟选择器:紧跟在目标元素后的所有兄弟元素(代表符号:~)

 类似资料:
  • 问题内容: Safari和Chrome以及Opera和Firefox可以处理伪类和相邻兄弟选择器: 这可行。 但是,当添加另一个相邻的兄弟姐妹时: Webkit分崩离析。 但是,如果您先将鼠标悬停在该样式上, 然后将 鼠标悬停在该样式上,则会按照应有的方式应用样式。 我进一步感到困惑,因为如果添加: 无论是否声明了样式,它都会按预期方式开始工作。 我在以下位置看到此问题: 谷歌浏览器15.0.87

  • 本文向大家介绍举例说明你对相邻兄弟选择器的理解相关面试题,主要包含被问及举例说明你对相邻兄弟选择器的理解时的应答技巧和注意事项,需要的朋友参考一下 div+p{ //相邻兄弟选择器 background: red; } 符合两个条件就会被选中: 1.紧邻在另一个元素后面 2.两者父元素相同

  • 相邻同胞选择器(E + F),选择紧跟在某个元素的后面,且具有相同父亲的元素。换句话说,E和F是同辈元素,F紧跟在E元素后面,即它们之间没有其他同胞元素。相邻同胞选择器中,+ 两侧的空白符是可选的。 如,一些博客站,博文标题后面的第一段是博文的摘要。HTML代码如下: <article>     <h1>相邻同胞选择器</h1>     <p>相邻同胞选择器,为同一个父元素下某个元素之后的第一个兄

  • 我看到一个选择器,并且必须查找它。 选择每个

  • 子选择器(E > F),就是只选择元素的直接后代(即子元素),而不选择其它后代的选择器。这就是子选择器与后代选择器的区别。子选择器中,> 两侧的空白符是可选的。 在上一节导航菜单的例子中,假如我们希望第一级列表项的链接文本的字体加粗显示。因为第一级列表项是 ul 的子元素,这时,就可以使用子选择器来实现。如: ul > li a { font-weight: bold;}

  • 关系选择器,顾名思义,是根据HTML元素在DOM树中的关系来选择元素,这些关系包括后代、父子、同胞、相邻同胞。于是,关系选择器就包括后代选择器、子选择器、相邻同胞选择器、同胞选择器。 表 2-2 关系选择器 选择器 语法 功能描述 版本 后代选择器 E F 选择E元素的所有后代F元素 1 子选择器 E > F 选择E元素的所有子元素F 2 相邻同胞选择器 E + F 选择紧接在E元素之后的第一个兄