Html <center> 的替换
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11478067/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Replacement for <center>
提问by JacobTheDev
This has been asked before by other people, but I've never seen an adequate answer. Is there a valid replacement to the <center>tag?
其他人之前已经问过这个问题，但我从未见过足够的答案。是否有有效的<center>标签替代品？
I know there's margin: 0 auto;, but that requires setting a width. There's also align="center", but I believe that that's invalid code as well.
我知道有margin: 0 auto;，但这需要设置宽度。还有align="center"，但我相信那也是无效代码。
Is there something as simple as <center>that's valid? There are rare occasions where I still end up using it, even though it is deprecated. Just today, I ended up using a <center>to center the one button that needed centered on a web page. Yes, I could have set the width and gave it margin: 0 auto, but that's a lot of work for centering one single element, and it dirties up my code, which I take pride in keeping orderly. I don't really understand why <center>was deprecated in the first place, if nothing has replaced it.
有没有<center>这么简单有效的东西？在极少数情况下，我仍然使用它，即使它已被弃用。就在今天，我最终使用 a<center>来将需要在网页上居中的一个按钮居中。是的，我可以设置宽度并给它margin: 0 auto，但是要使单个元素居中需要做很多工作，并且会弄脏我的代码，我为保持有序而感到自豪。<center>如果没有任何东西取代它，我真的不明白为什么首先被弃用。
Thanks!
谢谢！
回答by Niet the Dark Absol
text-align: centeris what you should use. In fact, the ideal way is this:
text-align: center是你应该使用的。其实理想的方式是这样的：
.center {
text-align: center;
}
.center > div, .center > table /* insert any other block-level elements here */ {
margin-left: auto;
margin-right: auto;
}
Obviously, it's not quite as simple as you might hope for.
显然，这并不像您希望的那么简单。
Personally, I just use:
就个人而言，我只是使用：
.center {text-align: center;}
.tmid {margin: 0px auto;}
Then apply classes where needed.
然后在需要的地方应用类。
回答by WolvDev
It's not that easy to center elements without the center-tag.
没有 center-tag 将元素居中并不容易。
For this you need to do a workaround that works even in IE6:
为此，您需要做一个即使在 IE6 中也能工作的解决方法：
You need a div wrapper around the element you want to be centered and use text-align:center; width:100%.
Inside this div you place another div and set marginto auto and text-align:left;
您需要在要居中的元素周围使用 div 包装器并使用text-align:center; width:100%. 在这个 div 中放置另一个 div 并设置margin为 auto 和text-align:left;
<div style="text-align:center; width:100%">
<div style="margin:auto; text-align:left;">
This Container is centered
</div>
</div>
If you just want to center text you can use <p style="text-align:center;"></p>
如果您只想将文本居中，您可以使用 <p style="text-align:center;"></p>
This is the core. To simplify the thing, you can use a class for this (like Kolink wrote):
这是核心。为了简化事情，您可以为此使用一个类（如 Kolink 所写）：
CSS:
CSS：
.center {
text-align:center;
width:100%;
}
.center:first-child { //doesn't work in IE 6
margin:auto;
text-align:left;
}
HTML:
HTML：
<div class="center">
<div>
This Container is centered
</div>
</div>
回答by Mat Richardson
The reason why <center>is deprecated is that it is not a semantic tag, rather presentational and we should steer clear of using anything in HTML that isn't semantic in nature.
<center>不推荐使用的原因是它不是语义标签，而是展示性的，我们应该避免在 HTML 中使用任何本质上不是语义的东西。
It's the same reason that other presentational elements such as <b>, <i>etc have been deprecated, as there are ways of achieving the same in the CSS.
这是同样的原因，其他的表现性元素，如<b>，<i>等已被弃用，因为有在CSS实现相同的方式。
回答by ryanwaite28
to center elements i use this:
居中元素我使用这个：
.middlr {
display: block;
margin: auto;
}
works for every/any element. works for me.
适用于每个/任何元素。为我工作。
回答by gnath
Replacement for center tag:(You should do both)
置换中心标签：（你应该做两个）
Use this style for parent element:
将此样式用于父元素：
text-align:center;
文字对齐：居中；
Use this style for current element:
对当前元素使用此样式：
margin-left: auto; margin-right: auto;
左边距：自动；右边距：自动；
回答by Vino
.centered {
margin-left: auto !important;
margin-right: auto !important;
}
* > .centered {
text-align: center !important;
display: block;
}
回答by Cfreak
text-align: centeris the equivalent CSS
text-align: center是等效的 CSS
回答by javadroid
this is PHP-STORM offer: use this:
这是 PHP-STORM 优惠：使用这个：
<div style="text-align: center;"></div>
