bugl
bugl
HomeLearnPatternsPathsSearchPremium
HomeLearnPatternsPaths

Loading lesson path

Learn/CSS/Modern Layout
CSS•Modern Layout

Responsive Web Design

Introduction to Responsive Web Design

Responsive web design is about creating web pages that look good on all devices!

A responsive web design will automatically adjust for different screen sizes and viewports.

Best Experience For All Users

Web pages can be viewed with many different devices: desktops, tablets, and mobile phones.

Your web page should look good, and be easy to use, regardless of the device.

Responsive web design is about using HTML and CSS to automatically resize, hide, shrink, or enlarge a website, to make it look good on all devices.

Key components in responsive web design are:

  • Viewport <meta> tag
  • Flexible layout (grid and flex)
  • Mediaqueries

Previous

CSS Grid Layout

Next

CSS Flex Container