1_vhvw.html 836 B

1234567891011121314151617181920212223242526272829303132333435
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>Document</title>
  7. <style>
  8. *{
  9. margin: 0;
  10. padding: 0;
  11. }
  12. .box1{
  13. /* width: 100%;
  14. height: 100%; */
  15. /* position: fixed;
  16. top: 0;
  17. left: 0;
  18. right: 0;
  19. bottom: 0; */
  20. /* vh vw 相对单位 vh(viewport height) 相对于视口高度 vw(viewport width) 相对于视口的宽度*/
  21. /* 1vh = 1% 视口高度 */
  22. /* 1vw = 1% 视口宽度 */
  23. width: 100vw;
  24. height: 100vh;
  25. background-color: red;
  26. }
  27. </style>
  28. </head>
  29. <body>
  30. <div class="box1">
  31. </div>
  32. </body>
  33. </html>