<h2>ブラウザ表示領域のサイズと縦横比</h2>
<ul>
<li id="size"></li>
<li id="aspectRatio"></li>
<li id="aspectRatioFraction"></li>
</ul>
<script>
var width = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
var height = window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;
var aspectRatio = width + ":" + height;
var aspectRatioFraction = width / height;
document.getElementById("size").textContent = "Width: " + width + ", Height: " + height;
document.getElementById("aspectRatio").textContent = "Aspect Ratio (width:height): " + width + ":" + height;
document.getElementById("aspectRatioFraction").textContent = "Aspect Ratio (width/height): " + aspectRatioFraction.toFixed(2);
</script>
