Thuộc tính HTML Screen availWidth trả về chiều rộng 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.availWidth
Ví dụ
Hãy để chúng tôi xem một ví dụ về Thuộc tính chiều rộng 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 availWidth Property</h1>
<button class="btn" onclick="get()">Show availWidth Value</button>
<div class="show"></div>
<script>
function get() {
document.querySelector(".show").innerHTML = "Available Width is " + screen.availWidth + " px";
}
</script>
</body>
</html> Đầu ra
Nhấp vào “ Hiển thị giá trị Chiều rộng lịch phát sóng ”Để hiển thị giá trị của thuộc tính availWidth -
