Day38媒体查询的完整写法和link写法

媒体查询的完整写法了解即可，在开发中一般会省略不必要的部分
image
image
image

link配合媒体查询的写法：
image

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>媒体查询--link</title>
    <!-- 视口宽度小于等于768px，网页背景是红色 -->
     <link rel="stylesheet" media="(max-width:768px)" href="./4.red.css">
     <!-- 视口宽度大于等于1200px，网页背景是绿色 -->
     <link rel="stylesheet" media="(min-width:1200px)" href="./4.green.css">     
</head>
<body>
    
</body>
</html>
posted @ 2025-12-23 12:36  冰涿  阅读(3)  评论(0)    收藏  举报