Javascript 调整表格或窗口的大小？HTML5

试图让我的应用程序适应浏览器窗口的宽度和高度保持比例

我已经包括了一个例子：

是在photoshop中切片的，因此html的输出方式是每个div类都有自己的css，例如

 //HTML//
<div class="id1462-Select-Pattern">
 <a href="Patterns.html"><img src="http://www.travel-master.co.uk/coach-hire-minibus-images/email-quote.jpg"width="183" height="45" alt="" /></a>
</div>

//CSS//
div.id1462-Select-Pattern {
    position:absolute;
    left:80px;
    top:723px;
    width:183px;
    height:45px;
 }

---

我尝试过媒体查询，但画布和图像似乎没有调整大小。我还了解到，对于文本，您必须手动更改字体大小，但图像没有正确调整大小。

从图像中删除高度，仅设置宽度将调整图像大小并保持比例

您可以使用javascript函数获取浏览器的宽度和高度，如下所示：

function getBrowserWindowSize() {
    var myWidth = 0, myHeight = 0;
    if (typeof (window.innerWidth) == 'number') {
        //Non-IE
        myWidth = window.innerWidth;
        myHeight = window.innerHeight;
    }
    else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {
        //IE 6+ in 'standards compliant mode'
        myWidth = document.documentElement.clientWidth;
        myHeight = document.documentElement.clientHeight;
    }
    else if (document.body && (document.body.clientWidth || document.body.clientHeight)) {
        //IE 4 compatible
        myWidth = document.body.clientWidth;
        myHeight = document.body.clientHeight;
    }

    var currWindow = new Array();
    currWindow[0] = myWidth;
    currWindow[1] = myHeight;
    return currWindow;
}

通过再次调用此函数，您可以通过调整大小和加载事件来管理所需的元素宽度和高度