與jQuery，很容易用元素和瀏覽器窗口的尺寸來工作。
jQuery的維方法
jQuery有與尺寸工作幾個重要的方法：
- width()
- height()
- innerWidth()
- innerHeight()
- outerWidth()
- outerHeight()
jQuery的尺寸
jQuery的width()和height()方法
的width()方法設置或返回元素（不包括寬度padding, border和margin ）。
的height()方法設置或返回元素（不包括高度padding, border和margin ）。
下面的示例返回指定的寬度和高度<div>元素：
例
$("button").click(function(){
var txt = "";
txt += "Width: " + $("#div1").width() + "</br>";
txt += "Height: " + $("#div1").height();
$("#div1").html(txt);
}); 試一試» jQuery的innerWidth()和innerHeight()方法
該innerWidth()方法返回一個元素的寬度（包括padding ）。
該innerHeight()方法返回一個元素的高度（包括padding ）。
下面的示例返回內部寬度/高度指定的<div>元素：
例
$("button").click(function(){
var txt = "";
txt += "Inner width: " + $("#div1").innerWidth() + "</br>";
txt += "Inner height: " + $("#div1").innerHeight();
$("#div1").html(txt);
}); 試一試» jQuery的outerWidth()和outerHeight()方法
該outerWidth()方法返回一個元素的寬度（包括padding和border ）。
該outerHeight()方法返回一個元素的高度（包括padding和border ）。
下面的示例返回指定的外寬/高<div>元素：
例
$("button").click(function(){
var txt = "";
txt += "Outer width: " + $("#div1").outerWidth() + "</br>";
txt += "Outer height: " + $("#div1").outerHeight();
$("#div1").html(txt);
}); 試一試» 該outerWidth(true)方法返回一個元素的寬度（包括padding, border和margin ）。
該outerHeight(true)方法返回一個元素的高度（包括padding, border和margin ）。
例
$("button").click(function(){
var txt = "";
txt += "Outer width (+margin): " + $("#div1").outerWidth(true) + "</br>";
txt += "Outer height (+margin): " + $("#div1").outerHeight(true);
$("#div1").html(txt);
}); 試一試» jQuery的更多width()和height()
下面的示例返回文檔（HTML文件）和窗口（瀏覽器的視口）的寬度和高度：
例
$("button").click(function(){
var txt = "";
txt += "Document width/height: " + $(document).width();
txt += "x" + $(document).height() + "\n";
txt += "Window width/height: " + $(window).width();
txt += "x" + $(window).height();
alert(txt);
}); 試一試» 下面的示例設置指定的寬度和高度<div>元素：
自測練習用！
jQuery的CSS參考
對於所有的jQuery的CSS方法的完整概述，請訪問我們的jQuery HTML / CSS參考 。