我想.center通过4:3纵横比(每3个高度4个宽度)和高度保持div的宽度相对于它的高度100%; 然后水平对齐div的中心.
就像你在这里看到的flash应用程序一样.
这就是我所拥有的:
HTML:
<div id="stuff" class="center" width="800" height="600">
<canvas id="someHTML5">You cant play HTML5</canvas>
</div>
Run Code Online (Sandbox Code Playgroud)
CSS:
.center {
position: absolute;
left: 50%;
width: 800px; /* how do I make this relative; i want: pseudo code: width: height/3*4; */
height: 100%;
margin-left: -400px; /* -width/2 for horizontal alignment */
z-index: 100;
}
Run Code Online (Sandbox Code Playgroud)
我还有一个JavaScript循环来集成JavaScript端更新.