Creating responsive layouts - CSS Tutorial

- [Narrator] The way people visit and interact with the web has changed significantly as technology has evolved. In the past, web development was focused mainly on desktop computers and large monitors, but now we have smartphones, smart TVs, wearable technologies, and all other sorts of ways to consume the web. Responsive web design is a term used to describe an approach to web design or a set of best practices that are used to create a layout that can respond to a device. CSS gives us multiple ways to achieve this. One of the oldest ways to do this is through the use of CSS media queries. Media queries can be used to check many things, such as the width and height of a viewport, the width and height of a device, the orientation, like whether it's in landscape or portrait mode, as well as the resolution of a device. The media role can even detect whether the device is a printer, an actual screen, or speech, for screen…