Shulou(Shulou.com)06/01 Report--

This article mainly explains "CSS how to carry out responsive design". The explanation content in this article is simple and clear, easy to learn and understand. Please follow the ideas of Xiaobian and go deep into it slowly to study and learn "CSS how to carry out responsive design" together.

1. What is media inquiry

Media queries let us style a device based on its display characteristics (such as viewport width, screen scale, device orientation: landscape or portrait), and consist of a media type and one or more conditional expressions that detect media characteristics. Media properties that can be detected in media queries are width, height, and color (etc.). Media queries allow you to customize the display for specific output devices without changing the content of the page.

Using the @media query, you can define different styles for different media types.@ Media can be styled differently for different screen size, especially if you need to design responsive pages.@media is useful. When you resize your browser, the page will also re-render based on the browser's width and height.

II. Use of @media media queries

a. To add the following code to the html document to be compatible with the display effect of mobile devices

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.