无心柳 发表于 2019-12-26 18:48:34

关于网页自适应

<!DOCTYPE html>
<html>
        <head>
                <meta charset="utf-8">
                <title></title>
                <style type="text/css">
                        .zmx{
                                height: 200px;
                                width: 200px;
                                background-color: #1B6D85;
                                display: block;
                               
                        }
                        @mediascreen and(max-width:500px) {
                                .zmx{
                                        height: 200px;
                                        width: 400px;
                                        background:blue;
                                        display: block;
                                               
                                }
                               
                        }
                </style>
        </head>
        <body>
                <span class="zmx"></span>
               
        </body>
</html>
这么写对不对，为什么拉伸页面没有变化

隔壁家的杰瑞 发表于 2019-12-26 22:18:04

本帖最后由 隔壁家的杰瑞 于 2019-12-26 23:12 编辑

写入的格式出了错，“screen and”与后面的括号之间应该有个空格

wongyusing 发表于 2019-12-26 23:08:59

在head标签里面加上下面的代码试试<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
页: [1]
查看完整版本: 关于网页自适应