Web Dev Roadmap for Beginners (Free!): https://bit.ly/DaveGrayWebDevRoadmap
In this CSS introduction and tutorial for beginners, you will learn how CSS applies to HTML, the different types of CSS, the anatomy of a CSS ruleset, and how to avoid errors in your CSS code.
Subscribe https://bit.ly/3nGHmNn
This lesson is part of a CSS for Beginners tutorial series playlist:
https://www.youtube.com/playlist?list=PL0Zuz27SZ-6Mx9fd9elt80G1bPcySmWit
All Resources for this CSS Tutorial Series: https://github.com/gitdagray/css_course
Course Updates https://courses.davegray.codes/
CSS Introduction and Tutorial for Beginners
(00:00) Intro
(00:05) Welcome and Who This Tutorial Series Is For
(00:54) What is CSS?
(01:23) HTML vs CSS
(02:12) The Tools We Need
(03:00) Create an HTML page
(04:17) External CSS
(06:13) Adding Live Server to VS Code
(08:01) Internal CSS
(10:02) Inline CSS
(11:08) Anatomy of a CSS Ruleset
(12:22) Errors in CSS
(13:27) Validating your CSS code
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/items?itemName=ritwickdey.LiveServer
vscode-icons VS Code Extension: https://marketplace.visualstudio.com/items?itemName=vscode-icons-team.vscode-icons
Github Themes VS Code Extension: https://marketplace.visualstudio.com/items?itemName=GitHub.github-vscode-theme
W3C CSS Validator: https://jigsaw.w3.org/css-validator/
References:
MDN CSS: https://developer.mozilla.org/en-US/docs/Web/CSS
MDN CSS Basics: https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/CSS_basics
Follow Me:
Github: https://github.com/gitdagray
Twitter: https://twitter.com/yesdavidgray
LinkedIn: https://www.linkedin.com/in/davidagray/
Blog: https://yesdavidgray.com
Reddit: https://www.reddit.com/user/DaveOnEleven
Was this tutorial about getting started with CSS helpful? If so, please share. Let me know your thoughts in the comments.
#css #introduction #tutorial