Thread by @cgrkzlkn

📌 10 CSS Selectors You Must Know

Thread 🧵👇

#100DaysOfCode #CodeNewbie

1⃣ Universal Selector ( * ) : Selects all elements.

2⃣ General Sibling Combinator ( X ~ Y) : Selects Y if it follows the X, and are children of the same parent element.

3⃣ Adjacent Sibling Combinator ( X + Y ) : Selects Y if it immediately follows the X, and are children of the same parent element.

4⃣ Child Combinator ( X > Y ) : Selects Y if it is an immediate child of the X. It doesn't select all descendants.

5⃣ Attribute Selector 1 : X[title]

6⃣ Attribute Selector 2 : X[href="foo"]

7⃣ Attribute Selector 3 : X[href*="foo"]

8⃣ Attribute Selector 4 : X[href$=".org"]

9⃣ Attribute Selector 5 : X[href^="https"]

🔟Attribute Selector 6 : X[class~="foo"]

That's a wrap!

If you found it useful:

🔹Follow me @cgrkzlkn for more content on HTML, CSS and JavaScript 🧑‍💻
🔹Like ❤️
🔹Retweet the first tweet ⚡️



I appreciate it!