W3School TIY Editor
W3School 在线教程
改变方向
暗黑模式
运行代码
<!DOCTYPE html> <html> <head> <style> section { padding: 10px; margin: 10px; border: 1px solid black; background-color: lightgray; } /* 选择包含 h1 元素的 section 元素 */ section:has(h1) { background-color: gold; } /* 选择包含类名为 'funfact' 的元素的 section 元素 */ section:has(.funfact) { color: blue; } </style> </head> <body> <h1>:has() 实例</h1> <section> <h1>世界自然基金会</h1> <p>世界自然基金会（WWF）是一个致力于环境保护、研究和恢复的国际组织，前身为世界野生动物基金会。WWF 成立于 1961 年。</p> </section> <section> <h2>WWF 的熊猫标志</h2> <p class="funfact">熊猫已成为 WWF 的象征。WWF 著名的熊猫标志源自一只名为 Chi Chi 的熊猫，它在 WWF 成立的同一年从北京动物园转移到伦敦动物园。</p> </section> <section> <h2>WWF 的现在</h2> <p>最初的三个国家呼吁（现称为国家组织）也于 1961 年在英国、瑞士和美国成立。自那时以来，WWF-US 已发展到拥有超过 100 万支持者，并帮助领导了阿拉斯加、北部大平原及世界各地的保护项目。</p> </section> </body> </html>