CSS

CSS3中的only-of-type选择器

字号+ 编辑: Snake 修订: IT男在阿里 来源: 慕课网 2023-09-06 我要说两句(0)

only-of-type选择器用来选择一个元素是它的父元素的唯一一个相同类型的子元素。

only-of-type选择器

用来选择一个元素是它的父元素的唯一一个相同类型的子元素。

“:only-of-type”是表示一个元素他有很多个子元素,而其中只有一种类型的子元素是唯一的,使用“:only-of-type”选择器就可以选中这个元素中的唯一一个类型子元素。

通过“:only-of-type”选择器来修改容器中仅有一个div元素的背景色为橙色。

HTML代码:

<div>
  <p>我是一个段落</p>
  <p>我是一个段落</p>
  <p>我是一个段落</p>
  <div>我是一个Div元素</div>
</div>
<div>
  <div>我是一个Div</div>
  <ul>
    <li>我是一个列表项</li>
  </ul>
  <p>我是一个段落</p>
</div>

CSS代码:

.wrapper > div:only-of-type {
  background: orange;
}

演示结果:

图片10.png

阅完此文,您的感想如何?
  • 有用

    0

  • 没用

    0

  • 开心

    0

  • 愤怒

    0

  • 可怜

    0

1.如文章侵犯了您的版权,请发邮件通知本站,该文章将在24小时内删除;
2.本站标注原创的文章,转发时烦请注明来源;
3.交流群: PHP+JS聊天群

相关课文
  • 多个高度相同, 属性inline-block的div,有的div没有内容而有的div有内容,有内容的会下沉?

  • 让整个网页全局变成黑白色调的css代码

  • CSS生成内容

  • CSS3外轮廓属性

我要说说
网上宾友点评
沙发已空