首页 > 其他 > 详细

left与margin-left区别

时间:2014-04-23 11:06:09      阅读:729      评论:0      收藏:0      [点我收藏+]

left,right,top,bottom仅对于position:relative|absolute|fixed的元素有意义。

bubuko.com,布布扣
 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>
bubuko.com,布布扣

http://bbs.blueidea.com/thread-2919197-1-1.html

http://blog.csdn.net/tomatozq/article/details/7178144

 

left与margin-left区别,布布扣,bubuko.com

left与margin-left区别

原文:http://www.cnblogs.com/yiliweichinasoft/p/3682000.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!