CSS Crash Course In 30 Minutes

In this web development crash course, I will cram in as much about CSS as I can in about 30 minutes. If you are interested in learning CSS but know nothing, then you are in the right place. We will be looking at selectors, declarations, styles, etc. We will be creating a basic website and you can download the code for reference. This video is intended for beginners.

HTML Color Names:

Timestamps:
00:00 - Preface
01:10 - Code Editors
01:28 - What is CSS?
01:57 - CSS Usage
03:31 - Usage Demo
06:10 - CSS Selectors
06:47 - Colors Explained
08:26 - Fonts Explained
09:24 - Font Demo
10:42 - Units of Measurement
11:17 - em Demo
11:45 - Borders
13:18 - Padding
14:48 - Margin
15:06 - Box Model
15:52 - Header / Container
19:17 - Navigation Menu
22:05 - Jumbo with Image
24:34 - Main Section / Sidebar
27:35 - Footer
28:40 - @media / Responsive
30:11 - Position
31:38 - Clear Fix
36:58 - Extras (Radius, Text Styles, etc)
39:25 - Outro
_____________________________________

📚 Learn to CODE in just a FEW months here:
_____________________________________

🛠️ Tools I use:

_____________________________________

💖 Show support!
_____________________________________

Watch Next:
_____________________________________

Connect With Me:
_____________________________________

** Affiliate Disclaimer: Some of the above links may be affiliate links, which may generate me a sales commission at no additional cost to you.

#css #beginner #codestackr

[codeSTACKr]

Thanks for all of the support!! Continuing the Web Development 2019 Series. Here's the Beginners Guide to CSS.

Timestamps:
00:06 - Preface
01:10 - Code Editors
01:28 - What is CSS?
01:57 - CSS Usage
03:31 - Usage Demo
06:10 - CSS Selectors
06:47 - Colors Explained
08:26 - Fonts Explained
09:24 - Font Demo
10:42 - Units of Measurement
11:17 - em Demo
11:45 - Borders
13:18 - Padding
14:48 - Margin
15:06 - Box Model
15:52 - Header / Container
19:17 - Navigation Menu
22:05 - Jumbo with Image
24:34 - Main Section / Sidebar
27:35 - Footer
28:40 - @media / Responsive
30:11 - Position
31:38 - Clear Fix
36:58 - Extras (Radius, Text Styles, etc)
39:25 - Outro

📚 My Favorite Web Design Books 📚
Web Design with HTML, CSS, JavaScript and jQuery Set by Jon Duckett (paid link)

[claytonstamper]

These tutorials are seriously fantastic... even if it's slow taking off, please keep up the good work! You've seriously got a talent for this.

[DLeRoux]

Dude, you need to seriously do a Udemy or the like, course for in depth web dev tutorials. I got so much out of your 30min HTML for beginners that took hours from other resources.

[learnsoftwaredevelopment.]

2 years later, this tutorial is still amazing. Thank you^^

[ohs]

Man, you are so good at explaining . I can watch all of your videos at once.😍

[chaitanyakrishna]

this was was the best css tutorial i have seen, precise and on to the point without talking shit like other youtubers

[mdimtiazibnseraj]

You generate the thirst for learning and showed what to learn in 30 mins. If we practice them and learn in details, we are prepared for the next level.
Thank you so much for the summary of CSS. It is really helpful.

[Haasepko]

Starting to teach myself Web Development today. Your Videos are very helpful and youre doing a great job explaining it. Please carry on the good work. It helps a lot!

[PrinceKumar-hhyn]

I'm 4 years late but your concise video is helping me winning over time

[vst]

Really great tutorial! In 40 minutes I learned more than when I spent hours on other web tutorials. Keep it up!

[Ellispoppagiorgio]

This was a great course. Easy to follow along, but also easy to go back and pause skip forward and still find my place. Extremely helpful for someone who has become kinda discouraged when it comes to learning to be a web developer. Keep up the great work, because it's working. You've got great delivery.

Would be interesting, to dive deeper into positioning, and clear fixes. Among other stuff. Thank you again.

[Devstackr]

Back to back uploads! Another great one, keep it up :)

[rimatadevosyan]

For responsive I'll suggest giving the container { max-width: 1000px; margin: auto; } ! Thanks for the video !

[watchuganado]

This guy is so under rated you demo really well plus good accent I can really understand you easily no need caption thankyou man🥰

[matthewguillen]

Dude I’ve watched a crap ton of videos now and I’m onto advanced HTMLCSS JavaScript and you have by far the best introductory videos crash courses you should be proud you’re a great instructor unbelievable instructor

[BrianWaltmans]

Two days of hard studying your html and css crash couses gave me so much confidence in starting to build my own website, I feel like I have a great base to get started with. Thank you so much!

[abhinavkumar]

codeStackR love the way you are relaxed and explains things, incredibly amazing bro, hatsoff to you.😎, compact n crisp, to the point, covering all points of basic css.

[MrQooje]

Now, CSS makes sense. It's very simple and straightforward. Thanks very much for this amazing guide!

[worriedfisch]

It's so cool that there are such good tutorials in the internet for

[Yukalistic]

Just watch one of your videos about learn css grid in 20 mins. Pretty excited to watch this video. I have always wanted to learn website design and recently wanted to learn programming. I am taking self pace online courses that I really like. Your content is really helping me understand some of the concepts and practices. I am learning all this because the industry that I work in is taking a huge hit with Covid-19 pandemic and lots of us might see furloughs. Finally with all the days off we have now, I want to learn how to be a fullstack web developer and really learn different programming languages. Thank you very much for taking the time and putting all this information together.