如何在HTML中对齐div中心 [英] How to make a div center align in HTML

查看：106
本文介绍了如何在HTML中对齐div中心的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述


可能存在重复：

如何在div中居中？


以HTML为中心的一种简单方法是使用 align ='center'，但它不适用于div。



我试过了： 

  style ='text-align：center'; 
 style ='left：50％';

我甚至真的有一个中心标记

 <中心]，[

但我无法让我的目标div居中。

解决方案

<！DOCTYPE html>< html>>< html>>< < HEAD> <标题>中心< /标题> < /头> <身体GT; < div style =text-align：center;> < div style =width：500px; margin：0 auto; background：＃000; color：#fff;>此DIV居中< / div> < / DIV>测试和工作< / html>

在IE，Firefox，Chrome，Safari和Opera中。我没有测试IE6。 IE需要外部文本对齐。其他浏览器（和IE9？）将在您给出自动的DIV边距（左和右）值时起作用。保证金0 auto是保证金0 auto 0 auto（右上角左下角）的缩写。



注意：文本也位于内部DIV内部，如果你想让它保持在左边，只需指定text-align：left;对于内部DIV。



编辑：在标准模式下运行的IE 6,7,8和9将使用设置为自动的边距。


Possible Duplicate:
How to center a div in a div?

One simple way to make an object centered in HTML is using align='center', but it's not working for a div.

I tried:

style='text-align:center';
style='left:50%';

I even true a center tag

<center>

But I can't make my target div to be center.

解决方案 

<!DOCTYPE html>
<html>
  <head>
    <title>Center</title>
  </head>
  <body>

    <div style="text-align: center;">
      <div style="width: 500px; margin: 0 auto; background: #000; color: #fff;">This DIV is centered</div>
    </div>

  </body>
</html>

Tested and worked in IE, Firefox, Chrome, Safari and Opera. I did not test IE6. The outer text-align is needed for IE. Other browsers (and IE9?) will work when you give the DIV margin (left and right) value of auto. Margin "0 auto" is a shorthand for margin "0 auto 0 auto" (top right bottom left).

Note: the text is also centered inside the inner DIV, if you want it to remain on the left side just specify text-align: left; for the inner DIV.

Edit: IE 6, 7, 8 and 9 running on the Standards Mode will work with margins set to auto.

这篇关于如何在HTML中对齐div中心的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
前端开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆