HTML：替换< center> [英] HTML: Replacement for <center>

问题描述

我一直认为用< div style =text-align：center;>替换< center> 标签会得到同样的结果。显然我错了。

这是我的HTML的一部分：
（您也可以在我为此问题创建的页面中看到它的作用：
http://www.movi​​ez.4pu.com/ErrorPageSO.aspx

 < div style =margin：0 auto; background-color：red; border：5px solid black; margin-top： 5px; width：750px; text-align：center;> 
< span style =width：560px; padding-right：10px; text-align：left; float：left;> 
< h1>哎呀...很抱歉...< / h1> 
 
< h3>您刚刚遇到未知错误。< br />< / h3> 
这个网站是一个进行中的工作，我们已经被告知错误，并会尽我们所能来修复它。< br /> 
如果您可以的话，我们会很感激< br /> 
< br /> 
< h3> 
您可以通过相应的按钮联系我们并详细说明导致此错误出现的原因。 o回到< a style =text-decoration：underline;href =Default.aspx>主页< / a>并继续使用Moviez.NET。 
< / h3> 
< / span>< span style =width：180px; float：left;>< img src =资源/图片/ 404.jpg/>< / span> 
< / div> 
  

我想做两件事：

1. 在保持div位于页面中心的情况下，摆脱< center> 标记。


2. 确保外部DIV背景颜色和边框影响内部跨度。

更新：
目标1完成了。
目标＃2的时间。

解决方案使用 margin：0 auto ; 在您的封闭< div>

 < div style =margin：0 auto; background-color：red; border：5px solid black; margin-top：5px; width：750px; text-align：center;> 
< span style =width：560px; padding-right：10px; text-align：left;> 
< h1>糟糕...很抱歉。< / h1> 
 
< h3>您刚遇到未知错误。 < br />< / h3> 
这个网站是一个进行中的工作，我们已经被告知错误，并会尽我们所能来解决它​​。 < br /> 
如果您可以通过相应的按钮与我们联系并详细说明导致此错误出现的原因，我们将非常感激。< br /> 
< br /> 
< h3> 
您可以回到< a style =文字修饰：下划线; href =Default.aspx>主页< / a>并继续使用Moviez.NET。 
< / h3> 
< / span>< span style =width：180px;>< img src =资源/图片/ 404.jpg/>< / span> 
< / div> 
  

在行动中查看。

参考： CSS：集中事物

I always thought that replacing the <center> tag with <div style="text-align:center;"> will get me the same results. Apparently I was wrong.

This is a portion of my HTML: (you can also see it in action in the page I created for this question : http://www.moviez.4pu.com/ErrorPageSO.aspx

<div style="margin: 0 auto; background-color:red;border:5px solid black;margin-top:5px;width:750px;text-align:center;">
    <span style="width:560px;padding-right:10px;text-align:left;float:left;">
    <h1>Oops... We're sorry.</h1>

    <h3>You've just encountered an unknown error. <br /></h3>
    This site is a work-in-progress, we have already been informed of the error and will do our best to fix it. <br />
    We would be thankful if you could contact us through the appropriate button and elaborate on what caused this error to appear.<br />
    <br />
    <h3>
    You can go back to the <a style="text-decoration:underline;" href="Default.aspx">Home page</a> and continue using Moviez.NET.       
    </h3>
    </span><span style="width:180px;float:left;"><img src="Resources/Images/404.jpg" /></span>
</div>

I want to do 2 things:

1. Get Rid of the <center> tag while keeping the div in the center of the page.
2. Make sure the outer DIVs background color and border affect the inner spans.

UPDATE: Objective 1 is completed. Time for objective #2.

解决方案

Use margin: 0 auto; on your enclosing <div>

<div style="margin: 0 auto; background-color:red;border:5px solid black;margin-top:5px;width:750px;text-align:center;">
  <span style="width:560px;padding-right:10px;text-align:left;">
  <h1>Oops... We're sorry.</h1>

  <h3>You've just encountered an unknown error. <br /></h3>
  This site is a work-in-progress, we have already been informed of the error and will do our best to fix it. <br />
  We would be thankful if you could contact us through the appropriate button and elaborate on what caused this error to appear.<br />
  <br />
  <h3>
  You can go back to the <a style="text-decoration:underline;" href="Default.aspx">Home page</a> and continue using Moviez.NET.           
  </h3>
  </span><span style="width:180px;"><img src="Resources/Images/404.jpg" /></span>
</div>

See it in action.

Reference: CSS: centering things

这篇关于HTML：替换< center>的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！