标签:
一.DIV常用的居中方法:
①利用相对定位设置div外边距自动调整达到居中效果(ps:如果IE浏览器无效果还要在Body里面加上‘‘text-align:center‘‘这个属性,或是外面再加一层DIV,设置属性‘‘text-align:center‘‘),当然居中也有另一种写法:margin-left:auto;margin-right:auto 最重要的是div必须设置width属性
1 <body> 2 <div style="width:500px;margin:0 auto"> 3 ....... 4 </div> 5 </body>
②利用left和margin-left两个属性,先将div块设置为margin-left:50%(这表示这个div块的最左边那条边在中间),然后left属性值为div块宽度的负一半,
符号表示div向左边移动宽度的一半。补充说明一下:直接在css中设置left生效的前提是必须设置父容器position:absolute或relative
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>无标题文档</title> 6 <style> 7 #myDiv_1{ 8 width:300px; 9 height:200px; 10 background-color:#F00; 11 12 margin-left:50%; 13 position:absolute; 14 left:-150px; 15 } 16 </style> 17 </head> 18 19 <body> 20 <div id="myDiv_1"></div> 21 </body> 22 </html>
标签:
原文地址:http://www.cnblogs.com/Bangxw/p/4480871.html