웹 프로그래밍 기초/BOM 브라우저 객체

screen 객체

별초롱언니 2025. 4. 10. 16:36

window.screen 객체는 사용자 화면에 대한 정보를 포함한다. 

 

특징 정리

1. screen 객체는 window에 속하는 하위 객체이다.

2. screen 객체는 메서드가 존재하지 않는다. 

3. 단지 사용자 화면의 정보를 제공한다. 

 

screen 속성

속성 설명
width 스크린의 화면 너비를 반환 (픽셀단위)
height 스크린의 화면 높이를 반환 (픽셀단위)
availWidth windows 작업 표시줄 같은 인터페이스 기능 제외한 스크린의 너비 (픽셀단위)
availHeight windows 작업표시줄 같은 인터페이스 기능 제외한 스크린의 높이 (픽셀단위)
colorDepth 화면에서 사용 가능한 색상 수 반환
pixelDepth 화면의 색상 해상도 반환 
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script>
    document.write("Screen width : " + screen.width + "<br>");
    document.write("Screen height : " + screen.height + "<br>");
    document.write("Available width : " + screen.availWidth+ "<br>");
    document.write("Available height  : " + screen.availHeight+ "<br>");
    document.write("Screen color depth : " + screen.colorDepth+ "<br>");
    document.write("Screen pixel depth : " + screen.pixelDepth+ "<br>");
  </script>
</body>
</html>