Intermediate CSS Series

Name: Intermediate CSS Series
Author: Cliff Brozo

Jump into the intermediate skills of CSS

Preview the first lesson free — get full access to all 24 lessons.

Course: On-Demand

(upbeat music) Welcome to KnowledgeCity, and our course on cascading style sheets. My name's Cliff Brozo, and this is an intermediate level course. Which means that we're going to expect you to know just a little bit about CSS. If you're not sure, you might wanna visit our beginner course, and brush up on things you might not remember. In our intermediate course, we're going to talk about laying out the website, using cascading style sheets. We'll talk about where headers are supposed to go. How should we style our navigation bars? What's an aside, and what goes in there? Surely we know what goes in the content window. It's content, but what kind of content? And what should we put in a footer, and what should it look like? A lot of our course is going to discuss responsive design techniques. We want to create our websites so that, no matter what device the user's using, it will fit on their screen. We're going to have to discuss, what the viewport is, and how we analyze what user is using what device. We'll talk about, grid view, and how to use CSS to lay out our pages. And we'll discuss containers. Those are the things that we put things in. When we do discuss grid layout, we'll turn some complicated code, and we'll turn it into something that makes sense. We'll give you a visual, creating dropdown menus, for navigation, becomes easy and looks really nice when we style it in CSS. We'll talk about styling forms, make them look inviting so people will want to fill them in. Make it easy for them to fill in the form. Talk about different progress bars and how we can use a slider to allow the user to know, how far they've gotten. Finally, we'll discuss an image gallery, and how we can display our photographs, in a nice looking format. If the user's looking at our website on a desktop computer, they may see something that looks like this, broken up into four different columns. But if they have a tablet, it's not as wide. So they may get something like this. And if they have their phone, they may get something like this. All of that is done with CSS, and no changes to the website. So, I hope that you're going to join me through this journey, and we're going to, not only learn how things work, but why they work. I'll see you in the next lesson.

Intermediate Provider : Cliff Brozo 7 chapters · 24 Lessons · 2h 20m in Arabic, German, English, Spanish, French, Portuguese, Chinese

Course Description

Cascading Style Sheets (CSS) add color, style, and animation to web pages while allowing designers to keep formatting separate from content. This intermediate course builds on the fundamentals of CSS and teaches you how to bring your websites to life. As mobile devices now account for roughly half of all web traffic, it is crucial for web designers to know how to create responsive web pages that automatically adjust to the size of the user's device. In this course, you will learn how to create menus using CSS headers and navigation bars. We will also explore asides, content windows, and footers. The remainder of the course will focus on responsive design techniques, including viewport, grid view, containers, styling forms, and image galleries. By the end of this course, you will be able to create beautiful webpages that present themselves perfectly across all devices.

Learning Objectives:

What You'll Learn

Style articles and asides to structure page content
Build responsive page layouts using CSS Grid View
Create unique navigation bars, menus, headers, and footers
Control animation using keyframes
Design memorable, styled forms
Apply media queries and viewport settings for responsive design across devices

Key Takeaways

CSS adds color, style, and animation to web pages while keeping formatting separate from content.
This intermediate course builds on CSS fundamentals to bring websites to life.
Because mobile devices account for roughly half of all web traffic, web designers need to create responsive pages that adjust to the user's device size.
The course covers page layout elements including menus, navigation bars, asides, content windows, and footers.
Responsive design topics include viewport, grid view, containers, styling forms, and image galleries so pages present well across all devices.

Frequently Asked Questions

Who is this course for?

It is an intermediate course for web designers who already know the fundamentals of CSS and want to learn how to bring their websites to life and make them responsive across devices.

What will I be able to do after completing this course?

By the end of the course you will be able to create beautiful webpages that present themselves perfectly across all devices, including styling articles and asides, building grid layouts, creating navigation bars and forms, and controlling animation with keyframes.

What responsive design techniques does the course cover?

It covers responsive design techniques including viewport, grid view, containers, styling forms, image galleries, and media queries.

What prior knowledge do I need?

The course builds on the fundamentals of CSS, so it is intended for learners who already understand CSS basics.

What topics are taught in the lessons?

Lessons cover an introduction, page layout, responsive design, grid design, menus, animation, forms, and image galleries, ending with a conclusion.