使用 :only-child 伪类可为容器中唯一子元素设置样式，当且仅当该元素是其父元素的唯一直接子元素时生效，常用于动态内容中的单条数据或提示信息的特殊样式处理。
当你想为容器中唯一一个子元素设置样式时，可以使用 CSS 的 :only-child 伪类选择器。它会选中父元素中仅有的那个子元素，如果子元素数量不是1，就不会生效。
或者直接写在目标元素上：
元素:only-child { 样式声明 }假设你有一个列表，有时只包含一项，你想让这一项特别醒目：
<div class="list"> <p>这是唯一的段落</p> </div> <div class="list"> <p>第一项</p> <p>第二项</p> </div>
你可以这样写 CSS：
立即学习“前端免费学习笔记（深入）”；
.list p:only-child {结果是：第一个 <p> 会变红加粗，第二个例子中的两个段落都不会被选中，因为它们都不是“唯一子元素”。
基本上就这些。只要记住：有且仅有一个子元素时，:only-child 才起作用。
以上就是如何用css :only-child选择唯一子元素的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
广告Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
330
收藏
