CSS is indispensable when we talk about web design and development. Basic selectors like classes (.) and IDs (#) might be familiar, but some advanc...
For further actions, you may consider blocking this person and/or reporting abuse
Nice post, but I'm not sure if "advanced" is really the right word here; some of these are definitely less common, but some others have been found in every beginner CSS tutorial for the last few decades.
Some more selectors that I'd consider "advanced" would for example be
:nth-child,:is(),:has(), etc.Thank you for taking the time to read and provide feedback on the article. I appreciate your insights!
You make a valid point about some of these selectors being part of beginner tutorials. My intention with the term "advanced" was to highlight selectors that go beyond the absolute basics like class and ID selectors, especially for readers who might just be diving a little deeper into CSS. However, I understand that "advanced" might feel like a stretch for some developers, especially those who have been in the field for a while.
I'm glad you brought up :is(), :has(), and :nth-child() (I believe you might've meant this instead of :next-child). Those are indeed fantastic selectors that offer more depth and targeting capabilities. I'll consider covering them in a follow-up piece, diving into even more nuanced aspects of CSS selectors.
Thank you again for your valuable feedback. Continuous learning and sharing are what make our developer community so vibrant, and I appreciate your contribution to that!
Yes, you're absolutely right about
:nth-child()😅 (I edited my comment to correct that)Making a follow-up post with another set of selectors sounds like a nice idea 👍 Depending on how advanced you wanna make it, there's also a lot of potential in combining all those selectors, specially now that
:is()and:has()are a thing.Thank you for the correction and the great suggestion! I absolutely agree — the power of CSS selectors, especially when combined, can achieve some truly intricate and effective stylings. :is() and :has() indeed open up a world of possibilities. Thanks again for being such an engaged reader! 👩💻🌟
Well done!
There are some more selectors if someone is interested, have a look at:
Thanks for sharing these additional resources! 🙌 Mozilla's documentation is indeed a gold mine for developers. I'll definitely check them out and encourage others to do the same. Cheers! 🚀
Great refresher! I sometimes have to go back to CSS code I did to remember how I managed to, for example, get the list style images to work as ticked checkboxes on all steps preceding the current focused one in a how-to guide. Turns out I used the ~ relative selector backwards!
Thank you! Ah, the joys of revisiting past code and discovering the clever tricks we once used. The ~ general sibling selector can be tricky but powerful when used correctly. Uncovering those "aha!" moments in our work is always fun. Keep up the creative coding! 👩💻🌟
Great post 💥✨
Thank you so much! 💙 I'm glad you found it helpful. Do you have a favorite CSS selector or any tips to share? Always love learning from the community!
Love using
:not()!:not - CSS : Feuilles de style en cascade | MDN
La pseudo-classe de négation, :not(), est une notation fonctionnelle qui prend un sélecteur comme argument. Elle permet de cibler les éléments qui ne sont pas représentés par cet argument. Le sélecteur passé en argument ne doit pas contenir d'autre sélecteur de négation et ne doit pas cibler de pseudo-élément.
Ah, the :not() selector is indeed powerful! It's a great way to exclude specific elements and can make stylesheets so much cleaner. Thanks for sharing the MDN link and description. Happy coding! 🚀
thanks, great tips
Thank you for the kind words! I'm glad you found the tips useful. If you have any other CSS-related questions or topics you'd like covered, let me know. Happy coding! 🚀
Nice article, good for those who are starting out 👍.
Thank you so much! I'm glad you found it useful. Happy coding! 👩💻🚀
Good info. Thanks for sharing!
You're welcome! Glad you found it helpful. 😊
nice post
Thank you so much! I'm glad you found it useful. Happy coding! 👩💻🚀
🎨💡 Uncover the magic of CSS wizardry with "7 Advanced CSS Selectors You Should Know"! 🚀✨ This blog is a treasure trove for anyone passionate about web design and development. Elevate your styling game by delving into the secrets of these advanced selectors, carefully curated to empower your designs and create visually stunning websites.
Mastering these advanced CSS selectors is like adding a touch of finesse to your coding palette, allowing you to sculpt your web projects with precision and elegance. From sibling combinators to attribute selectors, this blog unveils the secrets that will set your CSS skills apart. Enhance your understanding, streamline your coding process, and bring your visions to life in the digital realm.
Don't miss out on this enlightening read – level up your CSS expertise and transform the way you craft web experiences. Get ready to shape the future of web design! 🌟🔥
However, You can find more information about Advanced CSS selector from the website given.