与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参考 。