VW和VH布局
- <title>体验vw和vh</title>
- <style>
- * {
- margin: 0;
- padding: 0;
- }
-
- /* vw 和 vh 是相对视口宽高计算结果,可以直接实现移动端适配效果 */
- /* .box {
- width: 50vw;
- height: 30vw;
- background-color: pink;
- } */
-
- .box {
- width: 50vh;
- height: 30vh;
- background-color: green;
- }
- </style>
- </head>
- <body>
- <div class="box"></div>
- </body>
复制代码
|