【基础】浏览器网页屏幕正文宽和高

console.log("网页可见区域宽" + document.body.clientWidth);
console.log("网页可见区域高" + document.body.clientHeight);
console.log("网页可见区域宽（包括边线宽）" + document.body.offsetWidth);
console.log("网页可见区域高（包括边线高）" + document.body.offsetHeight);
console.log("网页正文全文宽" +document.body.scrollWidth);
console.log("网页正文全文高" +document.body.scrollHeight);
console.log("网页被卷去的高" +document.body.scrollTop);
console.log("网页被卷去的左" +document.body.scrollLeft);
console.log("网页正文全文上" +window.screenTop);
console.log("网页正文全文左" +window.screenLeft);
console.log("屏幕分辨率的高" +window.screen.height);
console.log("屏幕分辨率的高" +window.screen.width);
console.log("屏幕可用工作区高度" +window.screen.availHeight);
console.log("屏幕可用工作区宽度" +window.screen.availWidth);

 

<script>
function getInfo(){
var s = "";
s += " 网页可见区域宽："+ document.body.clientWidth+"\n";
s += " 网页可见区域高："+ document.body.clientHeight+"\n";
s += " 网页可见区域宽："+ document.body.offsetWidth + " (包括边线和滚动条的宽)"+"\n";
s += " 网页可见区域高："+ document.body.offsetHeight + " (包括边线的宽)"+"\n";
s += " 网页正文全文宽："+ document.body.scrollWidth+"\n";
s += " 网页正文全文高："+ document.body.scrollHeight+"\n";
s += " 网页被卷去的高(ff)："+ document.body.scrollTop+"\n";
s += " 网页被卷去的高(ie)："+ document.documentElement.scrollTop+"\n";
s += " 网页被卷去的左："+ document.body.scrollLeft+"\n";
s += " 网页正文部分上："+ window.screenTop+"\n";
s += " 网页正文部分左："+ window.screenLeft+"\n";
s += " 屏幕分辨率的高："+ window.screen.height+"\n";
s += " 屏幕分辨率的宽："+ window.screen.width+"\n"; //手机分辨率
s += " 屏幕可用工作区高度："+ window.screen.availHeight+"\n";
s += " 屏幕可用工作区宽度："+ window.screen.availWidth+"\n";
s += " 你的屏幕设置是 "+ window.screen.colorDepth +" 位彩色"+"\n";
s += " 你的屏幕设置 "+ window.screen.deviceXDPI +" 像素/英寸"+"\n";
alert (s);

}
getInfo();

(function (){
var SCREENWIDTH =window.screen.width;
document.querySelector('html').style.fontSize = 'calc(100vw/'+(SCREENWIDTH/100)+')';
}());
var HTMLFONTSIZE = function (){
var SCREENWIDTH =window.screen.width;
document.querySelector('html').style.fontSize = 'calc(100vw/'+(SCREENWIDTH/100)+')';
}
window.onresize = function(){
HTMLFONTSIZE();
}

</script>