牛骨文教育服务平台(让学习变的简单)

JavaScript Window Screen



window.screen 对象包含有关用户屏幕的信息。


Window Screen

window.screen对象在编写时可以不使用 window 这个前缀。

一些属性:

  • screen.availWidth - 可用的屏幕宽度

  • screen.availHeight - 可用的屏幕高度


Window Screen 可用宽度

screen.availWidth 属性返回访问者屏幕的宽度,以像素计,减去界面特性,比如窗口任务栏。

实例

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>牛骨文(niuguwen.cn)</title>
</head>
<body>

<script>
document.write("可用宽度: " + screen.availWidth);
</script>

</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例


Window Screen 可用高度

screen.availHeight 属性返回访问者屏幕的高度,以像素计,减去界面特性,比如窗口任务栏。

实例

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>牛骨文(niuguwen.cn)</title>
</head>
<body>

<script>
document.write("可用宽度: " + screen.availHeight);
</script>

</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例


所有 screen 属性实例

实例

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>牛骨文(niuguwen.cn)</title>
</head>
<body>

<h3>你的屏幕:</h3>
<script>
document.write("总宽度/高度: ");
document.write(screen.width + "*" + screen.height);
document.write("<br>");
document.write("可用宽度/高度: ");
document.write(screen.availWidth + "*" + screen.availHeight);
document.write("<br>");
document.write("色彩深度: ");
document.write(screen.colorDepth);
document.write("<br>");
document.write("色彩分辨率: ");
document.write(screen.pixelDepth);
</script>

</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例