body是document所在的body標籤內的整體相關資訊的物件，如果能善用body物件，網頁可以寫得很精彩。 <BR />
body的屬性與方法 <BR />
scrollTop 捲軸頂端位置(如同VB的ScrollBar的Top屬性) <BR />
scrollLeft 捲軸左端位置(如同VB的ScrollBar的Left屬性) <BR />
scrollWidth 捲軸的寬度(如同VB的ScrollBar的Width屬性) <BR />
scrollHeight 捲軸的高度(如同VB的ScrollBar的Height屬性) <BR />
clientHeight 工作區域的高度(如同VB的Form的ScaleHeight屬性) <BR />
clientWidth 工作區域的寬度(如同VB的Form的ScaleWidth屬性) <BR />
<BR />
<BR />
<BR />
<BR />
<BR />
<BR />
定义 <BR />
IE5及其以后版本支持在CSS中使用expression，用来把CSS属性和Javas cript表达式关联起来，这里的CSS属性可以是元素固有的属性，也可以是自定义属性。就是说CSS属性后面可以是一段Javas cript表达式，CSS属性的值等于Javas cript表达式计算的结果。 在表达式中可以直接引用元素自身的属性和方法，也可以使用其他浏览器对象。这个表达式就好像是在这个元素的一个成员函数中一样。 <BR />
<BR />
给元素固有属性赋值 <BR />
<BR />
例如，你可以依照浏览器的大小来安置一个元素的位置。 <BR />
<BR />
#myDiv { <BR />
position: absolute; <BR />
width: 100px; <BR />
height: 100px; <BR />
left: expression(document.body.offsetWidth - 110 + "px"); <BR />
top: expression(document.body.offsetHeight - 110 + "px"); <BR />
background: red; <BR />
} <BR />
<BR />
给元素自定义属性赋值 <BR />
<BR />
例如，消除页面上的链接虚线框。 通常的做法是： <BR />
<BR />
<a href="link1.htm" onfocus="this.blur()">link1</a> <BR />
<a href="link2.htm" onfocus="this.blur()">link2</a> <BR />
<a href="link3.htm" onfocus="this.blur()">link3</a> <BR />
<BR />
粗看或许还体现不出采用expression的优势，但如果你的页面上有几十甚至上百个链接，这时的你难道还会机械式地Ctrl+C，Ctrl+V么，何况两者一比较，哪个产生的冗余代码更多呢？ <BR />
<BR />
采用expression的做法如下： <BR />
<BR />
<style type="text/css"> <BR />
a {star : expression(onfocus=this.blur)} <BR />
</style> <BR />
<a href="link1.htm">link1</a> <BR />
<a href="link2.htm">link2</a> <BR />
<a href="link3.htm">link3</a> <BR />
<BR />
说明：里面的star就是自己任意定义的属性，你可以随自己喜好另外定义，接着包含在expression()里的语句就是JS脚本，在自定义属性与expression之间可别忘了还有一个引号，因为实质还是CSS，所以放在style标签内，而非s cript内。OK，这样就很容易地用一句话实现了页面中的链接虚线框的消除。不过你先别得意，如果触发的特效是CSS的属性变化，那么出来的结果会跟你的本意有差别。例如你想随鼠标的移进移出而改变页面中的文本框颜色更改，你可能想当然的会认为应该写为 <BR />
<BR />
<style type="text/css"> <BR />
input <BR />
{star : expression(onmouseover=this.style.backgroundColor="#FF0000"; <BR />
onmouseout=this.style.backgroundColor="#FFFFFF")} <BR />
</style> <BR />
<style type="text/css"> <BR />
input {star : expression(onmouseover=this.style.backgroundColor="#FF0000"; <BR />
onmouseout=this.style.backgroundColor="#FFFFFF")} <BR />
</style> <BR />
<input type="text"> <BR />
<input type="text"> <BR />
<input type="text"> <BR />
<BR />
可结果却是出现脚本出错，正确的写法应该把CSS样式的定义写进函数内，如下所示： <BR />
<BR />
<style type="text/css"> <BR />
input {star : expression(onmouseover=function() <BR />
{this.style.backgroundColor="#FF0000"}, <BR />
onmouseout=function(){this.style.backgroundColor="#FFFFFF"}) } <BR />
</style> <BR />
<input type="text"> <BR />
<input type="text"> <BR />
<input type="text"> <BR />
<BR />
注意 <BR />
<BR />
不是非常需要，一般不建议使用expression，因为expression对浏览器资源要求比较高。 <BR />
<BR />
<BR />
<BR />
以前的解决方法主要是利用js来实现，但用过的人都知道该办法有点繁琐。还有一种是在外部容器定义over-flow:hidden。但这种办法只会切割图片而不会自动适用。
下面的办法的出现应该感谢伟大的css2.0和更伟大的microsoft（没有它就不必有这么啰嗦的代码了^_^）。本人仅在ie6.0,ff1.5,opera7.0于winXP下测试通过，希望通过此篇文章抛砖引玉，望更多高手指点。关键在于：max-width:780px;以及下面那行。
固定像素适应:
运行代码框
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>css2.0 VS ie</title>
<style type="text/css">
<!--
body {
font-size: 12px;
text-align: center;
margin: 0px;
padding: 0px;
}
#pic{
margin:0 auto;
width:800px;
padding:0;
border:1px solid #333;
}
#pic img{
max-width:780px;
width:expression(document.body.clientWidth > 780? "780px": "auto" );
border:1px dashed #000;
}
-->
</style>
</head>
<body>
<div id="pic">
<img src="/articleimg/2006/03/3297/koreaad_10020.jpg" alt="感谢blueidea被我盗链图片！"/>
</div>
</body>
</html>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
百分比适应:
运行代码框
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>css2.0 VS ie</title>
<style type="text/css">
<!--
body {
font-size: 12px;
text-align: center;
margin: 0;
padding: 0;
}
#pic{
margin:0 auto;
width:90%;
padding:0;
border:1px solid #333;
}
#pic img{
max-width:80%;
width:expression(document.body.clientWidth>document.getElementById("pic").scrollWidth*8/10? "80%": "auto" );
border:1px dashed #000;
}
-->
</style>
</head>
<body>
<div id="pic">
<img src="/articleimg/2006/03/3297/koreaad_10020.jpg" alt="感谢blueidea被我盗链图片！"/>
</div>
</body>
</html>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
提醒:
1 该方法不只是用于img;
2 max-width,max-height,min-width,min-height.
