媒体查询案例修改背景颜色

最新推荐文章于 2022-10-06 11:31:00 发布

A 神

最新推荐文章于 2022-10-06 11:31:00 发布

阅读量613

点赞数

分类专栏：移动端开发之rem布局

本文链接：https://blog.csdn.net/weixin_42378409/article/details/105389208

版权

本文通过具体的案例介绍如何运用CSS媒体查询@media，根据设备屏幕尺寸改变网页背景颜色，实现响应式设计。

摘要由CSDN通过智能技术生成

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        /* 1. 媒体查询一般按照从大到小或者 从小到大的顺序来 */
        /* 2. 小于540px 页面的背景颜色变为蓝色 */
        
        @media screen and (max-width: 539px