Welcome to CSS for Everybody, with your coding teacher Kalob Taulien.

This course is made up of 3 mini courses that include CSS 101, CSS 201, and CSS 301.

In CSS 101 we are going to get started with making an HTML website look a little more modern using CSS. Absolutely no experience is required for this module. Together, we will start at the very beginning and go through all the basics so you do not miss anything.

In CSS 201 we will dive into intermediate CSS and work with things like animations, transitions, flexbox, and CSS grid. This will give us all the skills we need to start making websites responsive so they look good on desktops, laptops, tablets, phones, and even TVs.

In CSS 301 we are focused completely on responsive web design. That is how we make a website look good on every device.

There are big projects at the end of all three modules. And in between several lessons are tasks to get hands on experience.

To get the most out of this course, you will need to know basic HTML. And you will likely want to pause the videos every now and then and code along with me.

Welcome to CSS for Everybody, and I will see you inside.

What is CSS?

CSS, otherwise known as Cascading Stylesheets, is used to make websites look and feel beautiful. See all the colors, shapes, and layouts on Eduonix? That is all done using CSS.

Who is this course for?

If you want to make websites look beautiful and work on device types such as phones, tablets, laptops, desktops, and TVs… this course is for you! 

If you have never written any CSS or you have written some CSS but want to level up your skill from beginner to boss, this course is for you! 

If you want to eventually get a job as a web developer, this course is for you!

What you will learn in CSS 101:

We will start off with getting a text editor installed, and learning about CSS syntax (the coding style in which CSS is written). Then we are going to dive into inline vs internal vs external styling, how to style certain HTML elements using CSS selectors, changing the text on our page, using different colors, changing default link styling, adding background images, working with borders, changing heights and widths of elements, changing spacing with margins and paddings, and making parts of your page see through.

There are several tasks between the lessons for immediate hands on experience, along with a final project.

What you will learn in CSS 201:

In this intermediate module, we wll apply everything we learned in CSS 101, and get our hands dirty with more advanced CSS. This includes understanding the display property, the box model, outlines vs borders, specific element positioning, advanced CSS selectors, pseudo selectors and pseudo elements, transitions, animations, flexbox, and CSS grid.

Just like in the CSS 101 module, there is a final project and a bunch of homework tasks between the lessons for immediate hands on experience.

What you will learn in CSS 301:

CSS 301 is all about responsive web design. This is how we make websites look great on all devices including phones, tablets, laptops, desktops, TVs, and more.

Responsive web design is the act of making a website “respond” to the width of the device that is viewing your website. With this, you can write one codebase that works well on every type of device so all of your viewers and website users will be happy.

We will dive right into media queries and what mobile first means and why it is important. Then we will make images and video embeds responsive. And we will finish the course with a final project where you make a flexbox (or CSS grid) page layout and then transform it into a responsive website so it looks amazing on smaller devices like a phone.

Course requirements:

You should know some basic HTML already. CSS is designed to work with HTML, so if you do not already know HTML then you will want to learn HTML first. Otherwise, if you already know a little HTML (you do not need to be an expert) then this course is for you! 

You will also need access to the internet to stream the lessons and a free text editing program like VS Code. And thats it!