为什么HTML中不推荐使用<center>标记？

Question

我很好奇为什么<center>HTML中的标记已被弃用.

这<center>是一种通过将容器封装在<center>标签中来快速居中对齐文本和图像块的简单方法,我现在找不到任何更简单的方法来实现它.

任何人都知道如何集中"东西"(不是margin-left:auto; margin-right:auto;和宽度的东西)的任何简单方法,取代的东西<center>？而且,为什么它被弃用了？

Answer 1

该<center>元素已被否决,因为它定义了演示文稿的内容-它并没有描述它的内容.

一种居中方法是将元素的属性margin-left和margin-right属性设置为auto,然后将父元素的text-align属性设置为center.这保证了元素将在所有现代浏览器中居中.

Answer 2

HTML就是为内容提供结构和意义,这应该是它的唯一功能.

但是,愚蠢的浏览器开发人员过去添加了各种标签,这违反了这一基本原则.

在某些时候,人们(部分地,至少)感觉到了,并且开始(试图)同意编写正确的HTML的规范,因此他们弃用了这些标签中的一些.

然而,损害已经完成 - 太多人已经学会了HTML"将标签放在东西和东西周围",而不是理解语义和演示之间的(重要和有用)区别,而那些人已经开始写书和教程,教别人错误的写HTML方式,他们自己也做了同样的事情,我们最终得到了一个正确的旧混乱.

理想情况下,center标签应该永远不存在,因为人们应该指出它不是"真正的"HTML,并告诉浏览器制造商回去做正确的事情.

对于正确的做法...对齐当然是一个演示问题 - 将布局和格式应用于(结构化)内容 - 而使用的语言是CSS.

然而,再次,愚蠢的浏览器开发人员搞砸了早期的CSS - 在许多情况下,创建网页的人不得不使用不正确的HTML,因为CSS根本不起作用.

现在,我们开始将一些有用的功能添加到CSS中,但仍然有很多未实现的功能,并且有很多东西可以以更好的方式实现,但现在已经标准化,所以我们是坚持旧的方式.

如果样式表是由明智的人实现的,那么你可以在任何体面的办公软件中拥有所有控件 - 对齐块和文本,它可以水平,垂直,倒置,旋转等工作 - 然后它不会以愚蠢的方式将左/右边距设置为自动.

为了完整起见,我将快速添加网页的第三个"级别",其中涉及向静态页面添加交互性,这当然是(错误命名的)JavaScript.

然而,那些愚蠢的浏览器开发人员并不知道他们在做什么.他们选择了一个完全不准确/无效的名称(出于营销原因),并且再次充斥着一种潜在的强大而强大的语言,其中存在缺陷,缺乏功能,并创造了一些(直到最近)被许多人憎恨的东西.

我们当然在过去几年中看到了JavaScript库的大起义,这有助于展示JS多年来能够提供的一些很酷的东西,隐藏了浏览器中仍然存在的许多浏览器漏洞,并且部分帮助补丁CSS支持,所以它更有用(尽管仍然有很多东西丢失).

所以是的,总结一切,最终的答案是因为浏览器制造商是愚蠢的.:)

Answer 3

根据W3Schools.com,

中心元素在HTML 4.01中已弃用,在XHTML 1.0 Strict DTD中不受支持.

在HTML 4.01规范给出了这样的理由弃用标签:

CENTER元素完全等同于将align属性设置为"center"指定DIV元素.

Answer 4

我所做的是采取中心或浮动等常见任务,并从中制作CSS类.当我这样做时,我可以在任何页面中使用它们.我也可以在同一个元素上调用我想要的数量.

.text_center {text-align: center;}
.center {margin: auto 0px;}
.float_left {float: left;}

现在我可以在我的HTML代码中使用它们来执行简单的任务.

<p class="text_center">Some Text</p>

Answer 5

我仍然有时使用<center>标签,因为CSS中的任何内容都不起作用.尝试使用<div>技巧和失败的示例:

<div style="text-align: center;">This div is centered, but it's a simple example.</div>
<br />
<div style="text-align: center;"><table border="1"><tr><td>&lt;div style="text-align: center;"&gt; didn't center correctly.</td></tr></table></div>
<br />
<div style="text-align: center;margin-left:auto;margin-right:auto"><table border="1"><tr><td>&lt;div style="text-align: center;margin-left:auto;margin-right:auto"&gt; still didn't center either</td></tr></table></div>
<br />
<center><table border="1"><tr><td>Actually Centered with &lt;center&gt; tag</td></tr></table></center>

<center>获得结果.要使用CSS,有时候你必须把CSS放在几个地方并把它弄得乱七八糟才能让它居中.为了回答你的问题,CSS已成为信徒和追随者的宗教,他们避免亵渎,不圣洁,并且为了自己的工作保障而过于简单.如果他们试图让你的<table>远离你,请问他们colspan或rowspan属性的CSS等价物是什么.

这不是抽象或书呆子的真理,而是重要的生活真理.
- 禅

Answer 6

最不受欢迎的答案

1. 不推荐使用的标签不一定是坏标签；
2. 还有是标签与表现逻辑处理，center就是其中之一;
3. 一个center标签是不一样的，与一个div text-align:center;
4. 事实上，你有另一种方式做某事并不会使它无效。

让我解释一下，因为这里有臭名昭著的反对者，他们会认为我在捍卫老派 HTML4 或其他东西。不，我不是。但围绕的争论center只是一场趋势战争，没有真正的理由放弃一个很好地服务于有效目的的标签。

所以让我们看看反对它的主要论点。

• “它描述的是呈现，而不是语义！”
  不，它描述了一个合乎逻辑的安排-是的，它有一个默认的外观，就像其他标签，如<p>或<ul>做。但重点是封闭部分与其周围环境的关系。中心说“这是我们通过视觉上不同的定位来区分的”。

• “它无效”
  是的。它只是被弃用，因为可以稍后删除。15+ 年了。显然，它不会去任何地方。有一些主要网站（包括 google.com）使用此标签，因为它非常易读且切中要害——这也是我们喜欢 HTML5 标签的相同原因。

• “它在 HTML5 中不受支持”实际上，
  它是最受广泛支持的标签之一。MDN 说“不鼓励使用它，因为它可以随时被删除”——好点子，但那一天可能永远不会到来，引用经典的话。Center 在 2004 年左右就已经被弃用了 - 它仍然存在并且仍然有用。

• “这是老派”
  鞋带也是老派。新方法不会使旧方法无效。你想要感觉进步和现代：很好。但不要让它成为法律。

• “这很愚蠢/尴尬/蹩脚/讲述了一个关于你的故事”
  这些都不是。它就像一把锤子：用于特定工作的一种工具。同一工作有其他工具，同一工具有其他工作；但它是为了解决某个问题而创建的，并且该问题仍然存在，因此我们不妨使用专门的解决方案。

• “你不应该这样做，因为，CSS”
  居中完全可以通过 CSS 来实现，但这只是一种方式，不是唯一的方式，更不用说唯一合适的方式了。任何受支持、工作和可读的东西都应该可以使用。此外，同样的争论发生在 flexbox 和 CSS 网格之前，这很有趣，因为当时没有 CSS 方法来实现 center 所做的。不，text-align:center不一样。不，margin:auto不一样。任何在 flexbox 之前反对 center 标签的人都对 CSS 了解不够。

特尔；博士：

不使用的唯一原因<center>是因为人们会讨厌你。

Answer 7

如果您愿意,您仍然可以使用XHTML 1.0 Transitional和HTML 4.01 Transitional.唯一的另一种方式(在我看来,最好的方式)是利润率:

<div style="width:200px;margin:auto;">
  <p>Hello World</p>
</div>

您的HTML应该定义元素,而不是管理它的表示.

Answer 8

它的目的是标记,即HTML标记,代表意义和结构,而不是外观.它在HTML的早期版本中非常混乱,但标准人们现在正试图清理它.

让标签控制外观的一个问题是,您的网页与残障人士的设备(例如屏幕阅读器)不能很好地兼容.它还会导致文本中包含大量标签,这些标签无助于阐明其含义,而是将其与不同级别的信息混杂在一起.

因此,CSS被认为是将格式/显示移动到另一种语言,这种语言与文本分开,并且可以很容易地保持这种方式.除此之外,这允许切换样式表以改变网页的外观而不触及其他标记.并且能够在一个膨胀的泡沫中为许多页面做到这一点.

CSS为您提供的工具并不总是很优雅,我就在您身边.例如,没有办法进行有效的垂直居中.而水平居中,如果它不仅仅是文本text-align,也不是更好.

您可以选择轻松,有效,混乱或干净,优雅和繁琐.我不明白为什么Web开发人员忍受这种混乱,但我想他们很高兴至少有机会完成他们的工作.

Answer 9

对于文本和图像，您可以使用text-align：

<div style="text-align: center;">
    I'm centered.
</div>

Answer 10

HTML用于构建数据,而不是控制布局.CSS旨在控制布局.你也会发现许多设计师<table>因为同样的原因而不得不使用布局.

Answer 11

您可以将其添加到您的CSS并使用<div class="center"></div>

.center{
  text-align: center;
  margin: auto;
  justify-content: center;
  display: flex;
}

或者，如果您想保留<center></center>并做好准备以防其被删除，请将其添加到您的 css 中

center{
  text-align: center;
  margin: auto;
  justify-content: center;
  display: flex;
}