How to create and style lists with HTML and CSS

>> YOUR LINK HERE: ___ http://youtube.com/watch?v=bRYwmmLC_Ns

Lists are one of the most common elements we have on websites, so I decided to do a beginner-friendly deep dive on them, exploring ordered and unordered lists, from how to create them, the difference between the two of them, their default styling, and how we can customize how they look with our own styles. • 🔗 Links • ✅ Live server for VS Code: https://marketplace.visualstudio.com/... • ✅ More on external style sheets: • HTML CSS for Beginners Part 9: Exte... • ✅ Collapsing Margins: • Margin and Padding Deep Dive: Collaps... • ✅ The different list-style-types: https://developer.mozilla.org/en-US/d... • ⌚ Timestamps • 00:00 - Introduction • 00:39 - The two most common types of lists • 04:12 - The importance of using the correct type of list • 05:10 - An example of using them correctly • 07:00 - The default styling of lists • 11:00 - Understanding and changing the spacing of our lists • 16:35 - Spacing between list items • 18:40 - Colors with list items • 19:40 - Changing the number or bullet point icons with list-style-type • 23:00 - Changing the bullet point to a custom image • 25:22 - Styling the bullet or number using ::marker • 30:22 - The one thing you shouldn’t do with lists • • #css • -- • Come hang out with other dev's in my Discord Community • 💬 / discord • Keep up to date with everything I'm up to • ✉ https://www.kevinpowell.co/newsletter • Come hang out with me live every Monday on Twitch! • 📺 / kevinpowellcss • --- • Help support my channel • 👨‍🎓 Get a course: https://www.kevinpowell.co/courses • 👕 Buy a shirt: https://teespring.com/stores/making-t... • 💖 Support me on Patreon: / kevinpowell • --- • My editor: VS Code - https://code.visualstudio.com/ • --- • I'm on some other places on the internet too! • If you'd like a behind the scenes and previews of what's coming up on my YouTube channel, make sure to follow me on Instagram and Twitter. • Twitter: / kevinjpowell • Codepen: https://codepen.io/kevinpowell/ • Github: https://github.com/kevin-powell • --- • And whatever you do, don't forget to keep on making your corner of the internet just a little bit more awesome!

#############################

New on site