CSS Complete Project for Beginners

This CSS Complete Project for Beginners guides you through a full tutorial for applying modern CSS and modern responsive web design to the website for The Little Taco Shop. This is the final project in a CSS for Beginners full course.

⭐ Become a full-stack web dev with Zero To Mastery Courses:

🚀 This lesson is part of a CSS for Beginners tutorial series playlist:

CSS Complete Project for Beginners

(0:00:00) Intro
(0:00:05) Welcome
(0:00:26) Project Intro
(0:00:55) Starter Code
(0:03:04) HTML head and meta tags
(0:07:03) HTML header, nav and hero
(0:20:49) Importing Google fonts
(0:21:31) CSS Reset
(0:23:28) CSS Variables
(0:27:37) CSS Utility Classes
(0:28:56) General Styles
(0:44:13) header and nav styles
(1:03:28) HTML footer and main
(1:10:53) footer styles
(1:12:47) main styles
(1:16:36) About styles
(1:19:08) Contact form styles
(1:26:16) Reviewing progress
(1:28:29) Heading and title consistency
(1:30:07) Converting an HTML table to a CSS grid
(1:34:21) Menu styles
(1:50:18) Evaluating desktop and mobile views
(1:52:04) Adding a media query
(1:54:55) Adding dark mode
(2:02:21) Organizing the CSS
(2:03:29) Preview: A touch of JavaScript
(2:08:50) Final Notes and changes

⚙ Web Dev Tools:

📚 New Project References:

✅ Follow Me:

Was this tutorial with a CSS Complete Project Tutorial for Beginners helpful? If so, please share. Let me know your thoughts in the comments.

#css #complete #project

[harshithtejadontoju]

Only when you go and watch lectures other YouTubers you'll realise how great and organised developer Dave is, the way he organises his content and teaches everything with great examples and applications also by keeping the future elements in mind is what makes me fall in love with his lectures. Coming across your channel is one of the best thing that has happened to me Dave, completed the whole CSS tutorial along with the project and I can't thank you enough for these wonderful lectures. I'm really looking forward to learning many things from your other playlists. And one day when I get a job, I'll definitely comeback and buy you your favorite coffee and tacos :)

[rubenpetrucza]

Best beginner course out there for learning CSS!
I want to thank you Dave, I started at my first front end dev job this monday, and your HTML course set me on this journey. Back then I was sad that your CSS course is not compete yet, but here it is finally!

[rightbackatcha]

did all the mini(ish) CSS lessons. can't wait to do this final project and jump to the JavaScript thank you sir. You are definitely the best instructor on this platform! I will probably be the guy that completes studying this whole channel at some point! That's the level of respect i have for your teaching method!

[mannymorenonz]

You are on fire Dave!! Wow 😳 thank you for providing all this resources and video tutorials

[VanPetersonKpoti]

Finally, I've just finished the CSS playlist.
I've learned a lot and it's been a really enriching experience.
May God bless you even more and give you even more wisdom and means of all kinds.
Thank you Mr. Dave.

[samirsamir]

a great work as usually Dave, your videos are easy to understand and to follow , big thanks

[nikolov]

Thank you Dave! I just finished your CSS course. It's hands down the best one on YouTube.


I am really glad I watched both your HTML and CSS courses and I will definitely check out your JavaScript course.
However, before doing that I will make sure to put what I've learned to use, by developing some real-world projects.

Again, thank you so much Dave, I really appreciate you! You are a gift to the web dev learning community ♥

[ujwal_]

I just love your content Dave:)
Thanks a lot for the easy to understand videos...

[ZakkFromSource]

Thanks for this awesome course Dave, you are the GOAT! 🐐

[viniciusm.m.]

Thanks, man!
God bless you!!!
Forte abraço do Brasil!

[Grihlo]

That's super helpful and useful! Thank you Dave!

[SubaydaAbdi]

you are the greatest teacher I ever seen in youtube and thank you for helping us to learn more about web development

[ogundekoadegbenga]

Awesome! This is the best CSS tutorial out there if you want to start or brush up your knowledge. Love the way you explained grid display and its constituents. Also the pseudo selectors too. Thanks Dave.👍👍

[robinheyer]

Another great tutorial! Thanks for taking your time on every subject. Thanks for not taking any prior (CSS) knowledge for granted. Thanks for emphasizing accessibility throughout the course. Thanks for teaching us not to just use divs everywhere for fancy styling. Thanks for sharing the grid and the flex game, MDN, the validators and caniuse.com and all those other resources. Thank you, thank you thank you!

[DenisGloba]

super project build dave gray Thanks knowledge share

[lachesis]

Thank you for this Dave. I really like your style of teaching and talking in general. Helped a lot, and still is helping, on my journey to become a frontend developer.

[tedbliss]

Finally I just finished the CSS playlist. Thank you For this awesome lecture Dave Gray but I still find myself not really good with that table and that hamburger menu, hoping to learn it better again. Striving for Progress over Perfection 💪

[chandrachurmukherjeejucse]

Sir I have a question. You are a god level instructor and there are many great teachers like kevin powell. My question is how you all gathered so much knowledge and experience? What resources you use to deliver the top notch content?

[hiwayshoes]

Hi Dave, just a quick question on the initial mechanics: would it be preferable or would there be any advantage in creating a separate CSS file for the reset, root, and utility classes then link it in the HTML head along with the main CSS file? Just curious… I’ll keep coming back to this tutorial as time allows…. Thank you again and again for all you do… Cheers 💖!

[Hen_ry_]

There's something I don't understand about offscreen.
How's it readable but not viewable

12:54