Learn how to create a Zebra-Striped List, using the :nth-child() CSS pseudo-class selector, which allows us to target elements based on their index/position in a group of siblings.

Creating striped lists, with alternating background colors, helps us differentiate list items, making them more distinguishable, and the :nth-child() CSS selector makes this task very simple!

In this video, we discuss in detail how to use the :nth-child() selector and we then use it to create striped lists!

Enjoy 😊

Don’t forget to share, like, subscribe and I would love to hear your thoughts in the comments section below!

Support the Channel 💙☕🙏
PayPal: https://paypal.me/CodingJourney

Affiliate Links*
Bluehost Web Hosting: https://www.bluehost.com/track/codingjourney/

*By making a purchase through any of my affiliate links, I’ll receive a small commission at no additional cost to you. This helps support the channel and allows me to continue creating videos like this. Thank you for your support!

Suggested Videos:
Animated Intro (HTML & CSS): https://www.youtube.com/watch?v=STUogvl25GU
Slide-In Overlay Hover Effect (HTML & CSS): https://www.youtube.com/watch?v=l0jLhFEzvJo
Card Flip Effect (HTML & CSS): https://www.youtube.com/watch?v=Lc6wyl1KdOc
Colorful Background with linear-gradient: https://www.youtube.com/watch?v=1q6papqTEqI
How to Change Text Selection Styling with CSS: https://www.youtube.com/watch?v=NOgZ_LzPiCk
Keeping Footer at the Bottom of the Page (HTML & CSS): https://www.youtube.com/watch?v=US_3XvufMLU

Codepen: https://codepen.io/Coding_Journey/
Twitter: https://twitter.com/CodingJrney
Email: codingjourney123@gmail.com

Subscribe 💖
https://www.youtube.com/channel/UCwpH4liYtBSiVXSfL8x2TyQ?sub_confirmation=1

#css #html #zebra