Learning Lab Home/Design/CSS - The Complete Guide (incl. Flexbox, Grid & Sass)

CSS - The Complete Guide (incl. Flexbox, Grid & Sass)

Course From:
Udemy

Join this bestselling CSS course to learn all about CSS from the ground up, in great depth!

CSS - short for Cascading Style Sheets - is a "programming language" you use to turn your raw HTML pages into real beautiful websites.

This course covers it all - we start at the very basics (What is CSS? How does it work? How do you use it)? and gradually dive in deeper and deeper. And we do this by showing both practical examples as well as the theory behind it.

Getting started with CSS might look easy but there actually is a lot of depth to CSS - hence this course provides different "Tracks" or "Entry points" to exactly meet your demands and reflect you current knowledge level:

  • The Basics Track: Start from scratch, learn CSS from the ground up. You start with lecture 1 and simply follow through to the end.

  • The Advanced Track: You already know the CSS basics, you know what selectors are and how it works but you want to dive in deeper and learn some advanced features and usages.

  • The Expert Track: You got the advanced knowledge, too, but you want to dive into things like Flexbox, CSS Grid, CSS Variables or Sass. This track is for you.

Of course this course offers the theory and practical examples - we'll build an entire real course project throughout the course - but there also are multiple assignments, quizzes and challenges for you to practice individual concepts taught throughout the course.

Talking about the course project - we'll build the frontend (no backend) of a fictional web hosting company. We'll have a starting screen which has different sections, we got a responsive design with an animated side-drawer, we got modals and forms and in general we got a lot of CSS animations, font styles and more!

 

Is this course for you?

It's for you if ...

  • you started with learning web development and you want to build more beautiful websites

  • you already know CSS but want to dive deeper

  • you're using CSS in a trial-and-error manner and want to change this (you should!)

You might come back later if ...

  • you're an absolute CSS pro and you know the CSS working group drafts by heart

  • you're a backend-only developer (Node, PHP, NO HTML or frontend JavaScript)

  • you're a total newcomer to web development and you don't know the basics about HTML

If that sounds good to you, we'd be more than happy to welcome you in this course!

SHOW MORE

Course
Intermediate
Careers

Careers Related to CSS - The Complete Guide (incl. Flexbox, Grid & Sass)

Certifications

Certifications related to Web Design or CSS

Visual Design Accelerator

General Assembly’s Visual Design course helps you explore the art and science of visual communication and the process of creating beautiful digital products. Create a production- ready composition for a responsive webpage, conveying your vision through typography, layout, and color. You’ll learn to give and receive design critique and implement feedback to improve your designs.

 

What you'll accomplish

This is a beginner-friendly program with no prerequisites, although many students have used software such as Photoshop, Sketch, Figma, or Adobe XD* previously and may be familiar with basic design principles. Beginners will have access to optional tutorials to practice using software and boost their confidence ahead of class. Throughout this expert-designed program, you’ll:

  • Conduct research to inform content strategy and design decisions.
  • Create a digital design solution that balances client needs and user goals.
  • Design digital layouts with industry-standard tools such as Figma and Sketch.
  • Implement visual design best practices in composition, typography, imagery, and colors.
  • Communicate design decisions to stakeholders and collaborators.
  • Apply what you’ve learned to create a portfolio project: a production-ready mockup for a responsive webpage and a presentation deck to document your process.

 

Why General Assembly

Since 2011, General Assembly has graduated more than 40,000 students worldwide from the full time & part time courses. During the 2020 hiring shutdown, GA's students, instructors, and career coaches never lost focus, and the KPMG-validated numbers in their Outcomes report reflect it. *For students who graduated in 2020 — the peak of the pandemic — 74.4% of those who participated in GA's full-time Career Services program landed jobs within six months of graduation. General Assembly is proud of their grads + teams' relentless dedication and to see those numbers rising. Download the report here.

 

Your next step? Submit an application to talk to the General Assembly Admissions team


 

Note: reviews are referenced from Career Karma - https://careerkarma.com/schools/general-assembly

 

General Assembly
UX Design Accelerator

Learn the tools and techniques to design products that are equal parts useful, functional, and delightful. Focusing on both theoretical frameworks and practical applications, students in General Assembly’s User Experience Design course will develop a portfolio project of their choosing — receiving expert feedback along the way.

 

What you'll accomplish

This is a beginner-friendly program with no prerequisites, although many students are familiar with digital design concepts. Whether you’re new to the field or you’re looking to formalize your practice, our curriculum helps you gain fluency in end-to-end UX processes, tools and documentation and put them to work for you, your company, and your career. Throughout this expert-designed program, you’ll:

  • Discover how to identify, ideate, articulate, and develop design solutions for UX challenges.
  • Describe how UX designers work with product managers, developers, and visual designers.
  • Explore the current UX design landscape through relevant, real-world examples.
  • Develop and document personas, journey maps, user flows, and annotated wireframes.
  • Utilize industry-standard tools to propose and refine design decisions.
  • Apply what you’ve learned to create a portfolio project: a new or redesigned digital product experience.

 

Why General Assembly

Since 2011, General Assembly has graduated more than 40,000 students worldwide from the full time & part time courses. During the 2020 hiring shutdown, GA's students, instructors, and career coaches never lost focus, and the KPMG-validated numbers in their Outcomes report reflect it. *For students who graduated in 2020 — the peak of the pandemic — 74.4% of those who participated in GA's full-time Career Services program landed jobs within six months of graduation. General Assembly is proud of their grads + teams' relentless dedication and to see those numbers rising. Download the report here.

 

Your next step? Submit an application to talk to the General Assembly Admissions team


 

Note: reviews are referenced from Career Karma - https://careerkarma.com/schools/general-assembly

 

General Assembly
Front-End Web Development Accelerator

General Assembly’s Front-End Web Development course equips complete beginners with the cutting-edge tools they need to build rich, interactive websites. Dive into essential programming languages, then round out your skill set with industry-relevant topics like responsive design, APIs, and version control. You’ll apply what you’ve learned to build a custom website from scratch.

What you'll accomplish

This is a beginner-friendly program with no prerequisites, although some students may have coded previously. First-time programmers will have access to pre-course preparatory lessons and additional resources to boost their confidence with key concepts. Throughout this expert-designed program, you’ll:

  • Discover how the web works.
  • Create the structure and style of a website using HTML and CSS.
  • Apply interactivity to a site with JavaScript programming fundamentals.
  • Host a website on a server.
  • Learn the basic technical vocabulary to communicate with front-end web developers and other technical stakeholders.
  • Apply what you’ve learned to create a portfolio project: a dynamic, responsive website.

 

Why General Assembly

Since 2011, General Assembly has graduated more than 40,000 students worldwide from the full time & part time courses. During the 2020 hiring shutdown, GA's students, instructors, and career coaches never lost focus, and the KPMG-validated numbers in their Outcomes report reflect it. *For students who graduated in 2020 — the peak of the pandemic — 74.4% of those who participated in GA's full-time Career Services program landed jobs within six months of graduation. General Assembly is proud of their grads + teams' relentless dedication and to see those numbers rising. Download the report here.

 

Your next step? Submit an application to talk to the General Assembly Admissions team


 

Note: reviews are referenced from Career Karma - https://careerkarma.com/schools/general-assembly

 

General Assembly
Courses

Courses related to Web Design or CSS

Product Design (Full-Time)
Flatiron School

Join the community of Flatiron School Product Design students who have gained hands-on UX / UI design experience using modern tools like Figma and Webflow. You’ll graduate with a professional portfolio,…

Intro to UX Design Webinar
General Assembly

Are you interested in UX Design, but have no prior experience or an idea of where to start? You’ve come to the right place!

…

4.5
(462)
Responsive Web Design Essentials - HTML5 CSS3 Bootstrap
Udemy

Hi there, my name is Daniel Scott and together we’re going to learn how to build professional responsive websites. which look good on mobiles, tablets and desktop screens.

We will build 4 sites together...

    …
Responsive Design HTML CSS Web design - Dreamweaver CC
Udemy

Hi there, my name is Dan and together we’re going to build a portfolio website using Adobe Dreamweaver.

We’ll use Dreamweaver's handy templating tools to make updates to our site super easy. We’ll create our very own mobile 'burger menu'…