Thuộc tính HTML Screen availHeight trả về chiều cao có sẵn trên màn hình của người dùng, nghĩa là nó loại trừ các tính năng giao diện của trình duyệt.
Cú pháp
Sau đây là cú pháp -
screen.availHeight
Ví dụ
Hãy để chúng tôi xem một ví dụ về Thuộc tính HTML Screen availHeight:
<!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 availHeight Property</h1>
<button class="btn" onclick="get()">Show availHeight Value</button>
<div class="show"></div>
<script>
function get() {
document.querySelector(".show").innerHTML = "Available Height is " + screen.availHeight + " px";
}
</script>
</body>
</html> Đầu ra
Nhấp vào “ Hiển thị giá trị lịch phát sóng ”Để hiển thị giá trị của thuộc tính availHeight -
