CSS List Styles Tutorial for Beginners

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

Web Dev Roadmap for Beginners (Free!): https://bit.ly/DaveGrayWebDevRoadmap • Learn CSS List Styles in this tutorial for beginners. Styling HTML lists with CSS can add impact to your HTML content. You will learn how to style lists with list-style-type and many other useful properties. • 🚩 Subscribe ➜ https://bit.ly/3nGHmNn • 🚀 This lesson is part of a CSS for Beginners tutorial series playlist: • • CSS Tutorials for Beginners • 🔗 All Resources for this CSS Tutorial Series: https://github.com/gitdagray/css_course • 📬 Course Updates ➜ https://courses.davegray.codes/ • CSS List Styles Tutorial for Beginners • (00:00) Intro • (00:05) Welcome • (00:26) Setup • (02:21) list-style-type • (04:27) Useful HTML attributes • (05:32) Removing list item styles • (05:53) The unordered list • (06:10) list-style-position • (07:10) List items inherit typography • (07:43) list-style-image • (08:33) list-style shorthand • (09:38) List item styles • (10:25) nth-child pseudo-class • (11:21) ::marker pseudo-element • (15:10) One more helpful HTML attribute • ⚙ Web Dev Tools: • 🔗 Chrome Browser: https://www.google.com/chrome/ • 🔗 Visual Studio Code (VS Code): https://code.visualstudio.com/ • 🔗 Live Server VS Code Extension: https://marketplace.visualstudio.com/... • 🔗 vscode-icons VS Code Extension: https://marketplace.visualstudio.com/... • 🔗 Github Themes VS Code Extension: https://marketplace.visualstudio.com/... • 🔗 W3C CSS Validator: https://jigsaw.w3.org/css-validator/ • 🔗 Specificity Calculator: https://specificity.keegan.st/ • 📚 References: • 🔗 MDN CSS: https://developer.mozilla.org/en-US/d... • 🔗 MDN CSS Basics: https://developer.mozilla.org/en-US/d... • 🔗 MDN CSS Selectors: https://developer.mozilla.org/en-US/d... • 🔗 MDN - How to Apply Colors to HTML Elements with CSS: https://developer.mozilla.org/en-US/d... • 🔗 MDN - CSS Values and Units: https://developer.mozilla.org/en-US/d... • 🔗 MDN - The Box Model: https://developer.mozilla.org/en-US/d... • 🔗 MDN - Styling Lists: https://developer.mozilla.org/en-US/d... • 📚 Typography Resources: • 🔗 MDN: Fundamental Text and Font Styling - https://developer.mozilla.org/en-US/d... • 🔗 CSSFontStack.com: Websafe Fonts - https://www.cssfontstack.com/ • 🔗 MDN: Styling Links - https://developer.mozilla.org/en-US/d... • 📚 Color Resources: • 🔗 Coolors Contrast Checker: https://coolors.co/contrast-checker/1... • 🔗 WebAIM Contrast Checker: https://webaim.org/resources/contrast... • 🔗 Coolors Palette Generator: https://coolors.co/ • 🔗 HTML Color Codes: https://htmlcolorcodes.com/ • ✅ Follow Me: • Github: https://github.com/gitdagray • Twitter: / yesdavidgray • LinkedIn: / davidagray • Blog: https://yesdavidgray.com • Reddit: / daveoneleven • Was this tutorial about how to style HTML lists with CSS helpful? If so, please share. Let me know your thoughts in the comments. • #css #lists #styles

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

New on site