html旋转及自适应

<div id="main">html页面</div>

一、使用css达到旋转目的

#main {
    -webkit-transform: rotate(90deg); /* Safari and Chrome */
    -moz-transform: rotate(90deg);   /* Firefox */
    -ms-transform: rotate(90deg);   /* IE 9 */
    -o-transform: rotate(90deg);   /* Opera */
    transform: rotate(90deg);
} 

二、自适应（js）

$("#main").css({
            "width": document.body.clientHeight,
            "height": document.body.clientWidth,
            "position": "absolute",
            "top": ((document.body.clientHeight - document.body.clientWidth) / 2),
            "left": -((document.body.clientHeight - document.body.clientWidth) / 2)
        });

网页可见区域高：document.body.clientHeight

网页正文全文高：document.body.scrollHeight
网页可见区域高（包括边线的高）：document.body.offsetHeight
网页被卷去的高：document.body.scrollTop

屏幕分辨率高：window.screen.height

详情可见：搞清clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTop