Computer >> Máy Tính >  >> Lập trình >> HTML

Thuộc tính chiều cao màn hình HTML

Thuộc tính Chiều cao màn hình HTML trả về tổng chiều cao màn hình của người dùng.

Cú pháp

Sau đây là cú pháp -

screen.height

Ví dụ

Hãy để chúng tôi xem một ví dụ về Thuộc tính chiều cao màn hình HTML -

<!DOCTYPE html>
<html>
<style>
   body {
      color: #000;
      height: 100vh;
      background-color: #FBAB7E;
      background-image: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%);
      text-align: center;
   }
   .btn {
      background: #db133a;
      border: none;
      height: 2rem;
      border-radius: 2px;
      width: 40%;
      display: block;
      color: #fff;
      outline: none;
      cursor: pointer;
      margin: 1rem auto;
   }
   .show {
      font-size: 1.2rem;
      margin: 1rem auto;
      font-weight: bold;
      font-family: sans-serif;
   }
</style>
<body>
<h1>HTML screen height Property</h1>
<button class="btn" onclick="get()">Show Screen Height</button>
<div class="show"></div>
<script>
   function get() {
      document.querySelector(".show").innerHTML = "Total height is " + screen.height + "px";
   }
</script>
</body>
</html>

Đầu ra

Thuộc tính chiều cao màn hình HTML

Nhấp vào “ Hiển thị chiều cao màn hình ”Để hiển thị tổng chiều cao màn hình của người dùng -

Thuộc tính chiều cao màn hình HTML