根据media加载css

最新推荐文章于 2025-07-13 05:52:56 发布

haogexiaole

最新推荐文章于 2025-07-13 05:52:56 发布

阅读量551

点赞数

本文档通过示例展示了如何使用HTML与CSS实现响应式网页布局。针对不同屏幕尺寸（小于800px和大于等于800px），分别应用了不同的样式文件，并内联了媒体查询的注释示例。此布局适用于创建能在多种设备上良好显示的网站。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" href="59.css" media="screen and (max-width:800px)">
    <link rel="stylesheet" href="60.css" media="screen and (min-width:800px)">
    <style>
/*
        @media screen and (max-width:800px){
            .demo{
                background: red;
            }
        }
        @media screen and (min-width:800px){
            .demo{
                background: grey;
            }
        }
*/
         
    </style>
</head>
<body>
<div class="demo">
    1213121331
</div>    
</body>