When you enroll through our links, we may earn a small commission—at no extra cost to you. This helps keep our platform free and inspires us to add more value.

Udemy logo

HTML & CSS Flexbox: Create Amazing Responsive Websites

Learn advanced HTML, CSS3 Flexbox, Bootstrap Flex, Media Queries, Jquery and Create Websites with Responsive Design

     
  • 3.8
  •  |
  • Reviews ( 115 )
₹519

This Course Includes

  • iconudemy
  • icon3.8 (115 reviews )
  • icon3h 26m
  • iconenglish
  • iconOnline - Self Paced
  • iconprofessional certificate
  • iconUdemy

About HTML & CSS Flexbox: Create Amazing Responsive Websites

_

Udemy best seller in Flexbox topic

_

"Perfect!!! The instructor is an excellent communicator, and explains practical content in a concise manner, in a way that is easily understood. I've been working on building my own web app, and he makes difficult concepts simple." - Jordan McEachern

Last Update - July 2019

Are you looking for a course to build a modern website in the easiest and most efficient way?

If your answer is yes, you're in the right place. Here you will learn how to build responsive and modern websites using the flexbox layout model. My name is Luis Carlos, im an enginner & a web developer, and I will be your guide in the next hours for this course. I have several years of experience as a trainer and I will pass on all my knowledge in the area of web development.

Why Flexbox?

CSS Flexbox

simplifies complexity.

With Flexbox you will be able to do more with layouts, and

allow you to reach the complex layout in an easier

and fun way

writing less & clean code

to create them.

What you will learn and be able to do at the end?

Properties for parents (container) and childrens (flex items)

Align

and

position

flex items

Arrange items in different

directions

and

orders

Fill

the remaining space and

shrink

elements to not overflow

Create a

responsive webpage

with the respective content

Advanced layout techniques

Use of

media queries

and flexbox properties to create responsible sites

Creation of a

responsive form

and

web gallery

using flexbox

Use of

CSS3 properties

to create animations and effects

Create interactive pages with

Jquery

Flexbox Model applied with

Bootstrap framework

How is the course structured?

The course is structured in several sections where the first part

(section 2 and 3)

is dedicated to the

properties used

for creating websites using the flexbox model. The

section 4

guide to a real webpage, where i create the

holy grail layout using 2 methods

, one where i use only

one dimension

layout and later the same layout will be done in

two dimensions using nested containers

. With the main layout finished it will be

added the content

in order to understand how the flexbox will

position and align all the content

of the page. After create the first real webpage, it's time to learn

advanced techniques to create layouts

, where you can check the great

dynamic and versatility

of the flexbox model.

At this point you can already create websites to your own projects

, and only need to adapt your website to all types of devices, which is why you learn in

section 5

to use

media queries

in site creation.

Section 6

is dedicated to the creation of pages with different kinds of contents, using always the flexbox model, showing the great capacity that this model has for creating multiple web contents

(Responsive web galleries/ Forms / Image accordion slider/interactive pages using Jquery)

The course has some

documents available

that you can follow and can work as your guide, where it is possible to verify the

planning

and details that I

outlined

for the creation of the webpage and some details about layouts and some flexbox properties. Finally, i have created

quizzes

in which you can test the knowledge acquired during the course

Recommended speed:

-----What people say about my courses------

Recent reviews from another courses:

_"Ideal for students that are starting in this area. The instrutor goes direct to the subject, and make good code exemples. I have truly enjoyed this starting course of html. im waiting for new videos and other courses in this area by this instructor"_

AA

_"Good basic stuff fot those who are starting. Exercises made in videos are very well explained in each topic. I feel confident to the next exercises"_

TK

_"Videos with well defined content. Great step by step overview of each base number with many examples to understand all the conversions. This tutorial is very well prepared, the pace is perfect and the material presented is structured well."_

JW

What You Will Learn?

  • Understand and correctly use the flexbox properties used for flex container and flex items .
  • Know the default behavior of flexbox model .
  • Understand how to position and align flex items in layout .
  • Optimize code with shorthand properties .
  • Create a complete layout .
  • Use nested flex containers .
  • Create, position and align layout content .
  • Use advanced layout techniques with :nth-child selector .
  • Use of media queries and flexbox properties for responsive web design .
  • Create responsive webpages with different kind of contents using flexbox .
  • Use of CSS3 properties to create animation and effects .
  • Create responsive web galleries, forms and image accordion slider .
  • Create interactive pages using Jquery .
  • Use of flexbox model with boostrap framework Show moreShow less.