参考手册
Screen 对象
availWidth
height
返回 Screen 对象

Window screen.colorDepth 属性

实例

获取调色板的比特深度:

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h2>colorDepth 属性</h2>
  7. <p id="demo">
  9. <script>
  10. let depth = screen.colorDepth;
  11. document.getElementById("demo").innerHTML =  depth + " bits per pixel";
  12. </script>
  14. </body>
  15. </html>
运行一下

定义与用法

colorDepth 属性返回屏幕的颜色深度。

colorDepth 属性返回的单位为位/像素。

colorDepth 属性是只读的。

语法

  1. screen.colorDepth

返回值

类型描述
一个数字屏幕调色板的深度，单位为位/像素:
1, 4, 8, 15, 16, 24, 32, 或 48。

更多实例

给 8 位屏幕换另一种背景色（避免 8 位屏幕不支持现代颜色）:

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h2>colorDepth 属性</h2>
  7. <script>
  8. if (screen.colorDepth <= 8)
  9.   //8 位屏幕的简单蓝色背景色
  10.   document.body.style.background = "#0000FF"
  11. else
  12.   //适合现代屏幕的花式蓝色背景色
  13.   document.body.style.background = "#87CEFA"
  14. </script>
  16. </body>
  17. </html>
运行一下

所有 screen 属性:

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h2>Screen 属性</h2>
  7. <div id="demo"></div>
  9. <script>
  10. let text = "Total width/height: " + screen.width + "*" + screen.height + "<br>" +
  11. "Available width/height: " + screen.availWidth + "*" + screen.availHeight + "<br>" +
  12. "Color depth: " + screen.colorDepth + "<br>" +
  13. "Color resolution: " + screen.pixelDepth;
  15. document.getElementById("demo").innerHTML = text;
  16. </script>
  18. </body>
  19. </html>
运行一下

浏览器支持

screen.colorDepth 所有浏览器都支持:

属性
screen.colorDepthYesYesYesYesYes

相关页面

screen.availHeight 属性

screen.availWidth 属性

screen.height 属性

screen.width 属性

availWidth
height

分类导航