From a171a069855d60e11935a239da3ecc3ecb4e888b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9=20Restivo?= <andre.restivo@gmail.com>
Date: Wed, 14 Feb 2024 07:57:26 +0000
Subject: [PATCH] feat: added has pseudo-class to css slides

---
 markdown/css3.md | 26 +++++++++++++++++++++++++-
 1 file changed, 25 insertions(+), 1 deletion(-)

diff --git a/markdown/css3.md b/markdown/css3.md
index 3856c29..2cfef2e 100644
--- a/markdown/css3.md
+++ b/markdown/css3.md
@@ -478,7 +478,7 @@ p:empty
 
 ---
 
-# Negation Pseudo-class
+# Not Pseudo-class
 
 Represents elements that **do not match** a list of selectors:<br><small>Negation pseudo-class selectors cannot be nested.</small>
 
@@ -506,6 +506,30 @@ section :not(article) p /* does not select the paragraph */
 
 ---
 
+# Has Pseudo-class
+
+Represents elements where any of the relative selectors passed as arguments match:<br><small>Also known as the "parent selector" because it allows you to select elements based on their descendants.</small>
+
+```css
+section:has(p)    /* all sections that contain a paragraph */
+h1:has(+ h2)      /* a h1 that is followed by a h2 */
+:has(p)            /* any element that contains a paragraph */
+```
+
+Examples:
+
+```html
+<section>    <!-- selected by :has(p) and section:has(p)-->
+  <article>  <!-- selected by :has(p) -->
+    <p>The quick brown fox jumps over the lazy dog</p>
+  </article>
+</section>
+```
+
+What about "`section :has(p)`"?
+
+---
+
 ## Typographic Pseudo-elements
 
 Select **parts** of elements based on their position in the element: