HTML & CSS for Absolute Beginners: Introduction
Skills:
HTML & CSS90%
Key Takeaways
This video introduces the basics of HTML and CSS for absolute beginners, covering the fundamental tools and software needed to get started, including a computer, internet connection, browser, and text editor, specifically recommending Chrome and VS Code.
Full Transcript
hello my frontend friends and welcome to HTML and CSS for absolute beginners this course is here to teach you the very fundamentals of HTML and CSS and that's whether you're starting from absolute zero you've never even looked at a line of code you have no idea what those even are but you're interested in learning how to make websites or maybe you've toyed around with a few tutorials and started plugging away at HTML or css or both of them a little bit and you're looking to learn a little bit more and follow a bit more of a learning path to reinforce what you've learned and put sort of all the pieces together and make sense of what's going on whichever the case is you are definitely in the right place we're going to be starting from absolute zero and working our way up to making a responsive website from absolute scratch you can see it on screen right now with the final version is going to be now before we dive into how to actually do all of this and get into the nitty-gritty of learning HTML and CSS there are a few things that you are going to need now you probably have a couple of these things already considering you're watching this video but you're going to need a computer of some sorts uh you're also going to need to have an internet connection once again you're watching a video on YouTube so you probably have one of those uh and the other thing you will need is a browser which again you're watching this any browser I'm going to recommend you use Chrome just so you have the same experience as me but if you're using a different browser that is completely fine and finally you're going to need a text editor of some kind and the one I'm going to recommend is VSS code there are a lot of other text editors out there so if you'd prefer to use another one you can but I'm going to be using vs code as we go through this so if you want want things to look the same as what I'm doing which makes it a little bit easier to follow along I would recommend this the link for it is in the video description below and you can just click the big download for me Windows if you're on a Mac it is available on Mac it's completely free to get and it just it works really well it's a really nice piece of software and it's what we're going to be using to write all of our code in and so those are the main things you're going to need though for this course specifically uh we're going to be building out that project together so I'm supplying the design files that we're going to be using I'm supplying the images we're going to be using and all of the text so there is a Dropbox Link in the description below so I would suggest you go and grab that now just download it it's going to give you a zip you unzip it and you have everything you need to get started and then you're in the right place cuz we're here on YouTube this playlist is set up in order you can just follow along as you go through or if you'd prefer I've also set this up as a completely free course the link to that is also down below you can keep track of which lessons you've done when you revisit and come back you're going to leave off where you started but it's also not just video based all the videos are within the platform but there's also lot of text as well which can make it a little bit easier to reference the code we're going to be looking at there's also these interactive code blocks within the course so as we're learning something you can play with the little interactive version first before bringing in what we've learned into the larger project that we're building and it also has the benefit of being an adree experience so whichever one you choose all of the content is here it's also all in the course platform with some little extra bonus lessons and stuff in the written content over there you can choose whichever way you want to do it works perfectly fine for me I'm really looking forward to getting started so let's dive right into it in the next lesson l
Original Description
🎓 Enroll in this course for FREE - get additional lessons, written content, interactive exercises, and more: learn.kevinpowell.co
📂 Get the course files here: https://www.dropbox.com/scl/fo/kusdjekuytcaa3of0vtd4/AChRHcF13pNi93JWusfLW9A?rlkey=tbrbxnabsi52u6onal9rh7fwm&st=iyo2wujq&dl=0
🔗 Get VS Code: https://code.visualstudio.com/
Learn to build websites from scratch - even if you've never written a line of code before. This hands-on course teaches you the fundamentals of HTML and CSS, the building blocks of the web. You'll start with the basics and progress step-by-step to creating your own responsive websites. Perfect for complete beginners who want to start their web development journey.
#html #css
--
Come hang out with other dev's in my Discord Community
💬 https://discord.gg/nTYCvrK
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!
📺 https://www.twitch.tv/kevinpowellcss
---
Help support my channel
👨🎓 Get a course: https://www.kevinpowell.co/courses
👕 Buy a shirt: https://teespring.com/stores/making-the-internet-awesome
📽️ Join as a channel member: https://youtube.com/@KevinPowell/join
💖 Support me on Patreon: https://www.patreon.com/kevinpowell or through YT memberships: Join this channel to get access to perks:
https://www.youtube.com/channel/UCJZv4d5rbIKd4QHMPkcABCw/join
---
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.
Bluesky: https://bsky.app/profile/kevinpowell.co
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!
Watch on YouTube ↗
(saves to browser)
Sign in to unlock AI tutor explanation · ⚡30
Playlist
Uploads from Kevin Powell · Kevin Powell · 0 of 60
← Previous
Next →
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
How to create an awesome navigation bar with HTML & CSS
Kevin Powell
Improve your CSS by Keepin' it DRY
Kevin Powell
HTML & CSS for Beginners Part 6: Images
Kevin Powell
HTML & CSS for Beginners Part 7: File Structure
Kevin Powell
HTML & CSS for Beginners Part 4: Bold and Italic text and HTML comments
Kevin Powell
HTML & CSS for Beginners Part 5: Links
Kevin Powell
HTML & CSS for Beginners Part 3: Paragraphs and Headings
Kevin Powell
HTML and CSS for Beginners Part 1: Introduction to HTML
Kevin Powell
HTML and CSS for Beginners Part 2: Building your first web page!
Kevin Powell
HTML & CSS for Beginner Part 8: Introduction to CSS
Kevin Powell
HTML & CSS for Beginners Part 9: External CSS
Kevin Powell
HTML & CSS for Beginners Part 10: Divs & Spans
Kevin Powell
HTML & CSS for Beginners Part 11: Classes & IDs
Kevin Powell
HTML & CSS for Beginners Part 12: The CSS Box Model - Margin, Borders & Padding explained
Kevin Powell
HTML & CSS for Beginners Part 13: Background Images
Kevin Powell
HTML & CSS for Beginners Part 14: Style Text with CSS
Kevin Powell
HTML & CSS for Beginners Part 15: How to style links
Kevin Powell
HTML & CSS for Beginners Part 16: CSS selectors and Specificity
Kevin Powell
HTML & CSS for Beginners Part 17: How to Create and Style HTML Lists
Kevin Powell
HTML & CSS for Beginners Part 18: How Floats and Clears work
Kevin Powell
HTML & CSS for Beginners Part 19: Colors with CSS - hex, rgba, and hsla
Kevin Powell
HTML & CSS for Beginners Part 20: How to center a div
Kevin Powell
HTML & CSS for Beginners Part 21: How to create a basic website layout - the HTML
Kevin Powell
HTML & CSS for Beginners Part 22: How to create a basic layout - the CSS
Kevin Powell
How to Create a Responsive Website from Scratch - Part 1: The HTML #Responsive #HTML5
Kevin Powell
How to Create a Responsive Website from Scratch - Part 2: The Header and Hero area #Responsive #CSS3
Kevin Powell
How to Create a Responsive Website from Scratch - Part 3: The About Section #Responsive #CSS
Kevin Powell
How to Create a Responsive Website from Scratch - Part 4: Building a Responsive Portfolio Section
Kevin Powell
How to Create a Responsive Website from Scratch - Part 5: Call To Action and Footer #CSS #Responsive
Kevin Powell
Tutorial: Learn how to use CSS Media Queries in less than 5 minutes
Kevin Powell
End of the year upate and what's coming to my channel to start the new year
Kevin Powell
Create a CSS only Mega Dropdown Menu
Kevin Powell
CSS Tutorial: Outline and Outline Offset
Kevin Powell
CSS Blending Modes
Kevin Powell
Parallax effect | 2 different ways to add it with jQuery
Kevin Powell
CSS Units: vh, vw, vmin, vmax #css #responsive #design
Kevin Powell
How to Create a Website - Complete workflow | Part 01: Intro + Setting things up
Kevin Powell
100 Subscribers speed coding bonus video
Kevin Powell
How to Create a Website - Complete workflow | Part 02: The Markup #HTML
Kevin Powell
How to Create a Website - Complete workflow | Part 03: Sass Variables and a Mixin #Sass
Kevin Powell
How to Create a Website - Complete workflow | Part 04: Setting up the hero and header
Kevin Powell
How to Create a Website - Complete workflow | Part 05: Typography & Buttons
Kevin Powell
How to Create a Website - Complete workflow | Part 06.1: Building the navigation with Flexbox
Kevin Powell
How to Create a Website - Complete workflow | Part 06.2: Making the nav work with jQuery
Kevin Powell
Redesigning & Coding My Website #CreateICG
Kevin Powell
How to Create a Website - Complete workflow | Part 07: Starting the flexbox grid
Kevin Powell
How to Create a Website - Complete workflow | Part 08: Promo & Problem shooting!
Kevin Powell
How to Create a Website - Complete workflow | Part 09: The CTA and Footer
Kevin Powell
How to Create a Website - Complete workflow | Part 10: Making it responsive
Kevin Powell
How to Create a Website - Complete workflow | Part 11: Making it responsive con't
Kevin Powell
How to Create a Website - Complete workflow | Part 12: Putting the site online
Kevin Powell
Create a Custom Grid System with CSS Calc() and Sass
Kevin Powell
CSS em and rem explained #CSS #responsive
Kevin Powell
Should you use Bootstrap?
Kevin Powell
How to add Smooth Scrolling to your one page website with jQuery
Kevin Powell
Let's learn Bootstrap 4
Kevin Powell
How I approach designing a website - my thought process
Kevin Powell
Build a website with Bootstrap 4 - Part 1: The setup
Kevin Powell
Build a website with Bootstrap 4 - Introduction
Kevin Powell
Build a website with Bootstrap 4 - Part 2: Customizing Variables
Kevin Powell
More on: HTML & CSS
View skill →Related Reads
📰
📰
📰
📰
Starting the Frontend for a Full-Stack E-commerce Store (Auth Store, Axios, and Public vs. Protected Routing)
Dev.to · Chinwuba
Practice Frontend Typeahead Interviews With AbortController and ARIA
Dev.to · Karuha
Building Maintainable Frontend Systems
Dev.to · Ufomadu Nnaemeka
Using the Publish–Subscribe Pattern in React with Native Browser Events
Medium · JavaScript
🎓
Tutor Explanation
DeepCamp AI