前端开发单位vw和vh

本文转载自查看原文 2019-10-08 15:27 893 前端开发单位vw和vh

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>前端开发单位vw</title>

  <style>
    *{
      padding: 0;
      margin: 0;

    }
    .root {
      width: 1vw;
      height: 1vh;
      background: red;
    }

  </style>
</head>
<body>
<div class="root"></div>

<script>
  console.log(window.innerWidth,window.innerHeight)
  let oDiv =document.querySelector(".root");

  console.log(getComputedStyle(oDiv).width)
  console.log(getComputedStyle(oDiv).height)

</script>
</body>
</html>

vw和vh介绍

什么是视口:

免责声明！

本站转载的文章为个人学习借鉴使用，本站对版权不负任何法律责任。如果侵犯了您的隐私权益，请联系本站邮箱yoyou2525@163.com删除。

猜您在找 CSS中vw和vh单位的使用移动端css单位之 “vh” & “vw” css3自适应布局单位vw,vh详解 css3自适应布局单位vw,vh你知道多少？ px、em、rem、%、vw、vh、vm这些单位的区别 css3新单位vw、vh、vmin、vmax的使用详解 css中的像素单位px、em、rem、vh、vw 前端开发单词大全 px转vw和vh的工具（对前端同学有用）微信小程序布局中的单位及使用：px、rem、rpx、vw、vh、n%