2 img { width: 30px; height: 30px; background-color: red; }
3 .cover { position: absolute; background-color: green; opacity: 0.7; }
5 <div style="height: 500px;
6 background-color: lightyellow;
7 -webkit-writing-mode: horizontal-bt;
10 -webkit-font-smoothing: none;
15 <ruby id="t-1">1<span id="t-2">2</span><rt id="t-3">3</rt></ruby>
17 <div id="t-4" style="display: inline-block">4<div id="t-5">5</div></div>
23 7 <span id="t-8">8</span>
27 for (var i = 0; i < 9; ++i) {
28 var element = document.getElementById("t-" + i);
29 var clientRect = element.getClientRects()[0];
30 var cover = document.createElement("div");
31 cover.className = "cover";
32 cover.style.width = clientRect.width + "px";
33 cover.style.height = clientRect.height + "px";
34 cover.style.top = clientRect.top + "px";
35 cover.style.left = clientRect.left + "px";
36 document.body.appendChild(cover);