left,right,top,bottom仅对于position:relative|absolute|fixed的元素有意义。
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>inline-block</title> 6 <style type="text/css"> 7 body{font-family:verdana;font-size:12px;} 8 9 10 div{margin-bottom:20px;border:solid 1px blue;position:relative;height:80px;} 11 b,u{display:inline-block;border:solid 1px #00a;padding:10px;} 12 u{background:#eee;} 13 </style> 14 </head> 15 <body> 16 <p>margin-top:20px;margin-left:20px;</p> 17 <div class="container"> 18 <b>蓝色</b><u style="margin-top:20px;margin-left:20px;">蓝色</u><b>蓝色</b> 19 </div> 20 <p>position:relative;top:20px;left:20px;</p> 21 <div class="container"> 22 <b>蓝色</b><u style="position:relative;top:20px;left:20px;">蓝色</u><b>蓝色</b> 23 </div> 24 <p>position:absolute;top:20px;left:20px;</p> 25 <div class="container"> 26 <b>蓝色</b><u style="position:absolute;top:20px;left:20px;">蓝色</u><b>蓝色</b> 27 </div> 28 <p>position:fixed;bottom:20px;left:20px;(IE6不支持fixed)</p> 29 <div class="container"> 30 <b>蓝色</b><u style="position:fixed;bottom:20px;left:20px;">蓝色</u><b>蓝色</b> 31 </div> 32 </body> 33 </html>