Warum ist das <center> -Tag in HTML veraltet?

Ich bin nur neugierig, warum das <center>Tag in HTML veraltet war.

Das <center>war eine einfache Möglichkeit, Text- und Bildblöcke schnell mittig auszurichten, indem der Container in ein <center>Tag eingekapselt wurde , und ich kann wirklich keine einfachere Möglichkeit finden, dies jetzt zu tun.

Kennt jemand einen einfachen Weg, wie man "Zeug" zentriert (nicht das margin-left:auto; margin-right:auto;und die Breite), etwas, das ersetzt <center>? Und warum wurde es veraltet?

Das <center>Element war veraltet, weil es die Darstellung seines Inhalts definiert - es beschreibt seinen Inhalt nicht.

Eine Methode zum Zentrieren besteht darin, die Eigenschaften margin-leftund margin-rightdes Elements auf autound anschließend die Eigenschaft des übergeordneten Elements auf text-alignfestzulegen center. Dies garantiert, dass das Element in allen modernen Browsern zentriert wird.

Nach W3Schools.com ,

Das Center-Element war in HTML 4.01 veraltet und wird in XHTML 1.0 Strict DTD nicht unterstützt.

Die HTML 4.01-Spezifikation gibt diesen Grund für die Ablehnung des Tags an:

Das CENTER-Element entspricht genau der Angabe des DIV-Elements, wobei das align-Attribut auf "center" gesetzt ist.

Was ich tue, ist, allgemeine Aufgaben wie Zentrieren oder Schweben zu übernehmen und daraus CSS-Klassen zu machen. Wenn ich das mache, kann ich sie auf allen Seiten verwenden. Ich kann auch so viele aufrufen, wie ich möchte.

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

Jetzt kann ich sie in meinem HTML-Code verwenden, um einfache Aufgaben auszuführen.

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

Manchmal verwende ich immer noch das <center> -Tag, da auch in CSS nichts funktioniert. Beispiele für den Versuch, einen <div> -Trick zu verwenden, und das Scheitern:

<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> erzielt Ergebnisse. Um stattdessen CSS zu verwenden, müssen Sie CSS manchmal an mehreren Stellen platzieren und damit herumspielen, damit es richtig zentriert wird. Um Ihre Frage zu beantworten, ist CSS zu einer Religion mit Gläubigen und Anhängern geworden, die <center> <b> <i> <u> als Gotteslästerung, unheilig und viel zu einfach für ihre eigene Arbeitsplatzsicherheit gemieden haben. Und wenn sie versuchen, Ihnen Ihre <Tabelle> wegzunehmen, fragen Sie sie, was das CSS-Äquivalent des Colspan- oder Rowspan-Attributs ist.

Es ist nicht die abstrakte oder buchstäbliche Wahrheit, sondern die gelebte Wahrheit, die zählt.
- Zen

Sie können dies weiterhin mit XHTML 1.0 Transitional und HTML 4.01 Transitional verwenden, wenn Sie möchten. Der einzige andere Weg (meiner Meinung nach der beste Weg) ist mit Rändern:

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

Ihr HTML-Code sollte das Element definieren und nicht dessen Darstellung steuern.

Es ist beabsichtigt, dass Markups, dh die HTML-Tags, Bedeutung und Struktur darstellen, nicht das Erscheinungsbild. Es war in frühen Versionen von HTML stark durcheinander, aber die Standards, die die Leute jetzt versuchen, das zu bereinigen.

Ein Problem bei der Steuerung des Erscheinungsbilds von Tags besteht darin, dass Ihre Seiten mit Geräten für Behinderte wie Bildschirmlesegeräten nicht gut funktionieren. Es führt auch dazu, dass Ihr Text viele, viele Tags enthält, die nicht dazu beitragen, die Bedeutung zu verdeutlichen, sondern sie mit Informationen einer anderen Ebene überladen.

Daher wurde CSS entwickelt, um die Formatierung / Anzeige in eine andere Sprache zu verschieben, die vom Text getrennt ist und auf diese Weise problemlos beibehalten werden kann. Dies ermöglicht unter anderem das Wechseln von Stylesheets, um das Erscheinungsbild einer Webseite zu ändern, ohne das andere Markup zu berühren. Und das für viele Seiten in einem Swell Foop.

Die Tools, die CSS Ihnen dazu bietet, sind nicht immer elegant, ich bin auf Ihrer Seite. Zum Beispiel gibt es keine Möglichkeit, eine effektive vertikale Zentrierung durchzuführen. Und horizontale Zentrierung text-alignist nicht viel besser , wenn sie nicht nur für Text geeignet ist.

Sie haben die Wahl zwischen einfach, effektiv und durcheinander oder sauber, elegant und umständlich. Ich verstehe nicht, warum Webentwickler dieses Durcheinander ertragen, aber ich denke, sie sind froh, zumindest eine Chance zu haben, ihre Sachen zu erledigen.

HTML dient zur Strukturierung von Daten und nicht zur Steuerung des Layouts. CSS soll das Layout steuern. Sie werden auch feststellen, dass viele Designer aus <table>demselben Grund die Verwendung von Layouts missbilligen.

Für Text und Bilder können Sie verwenden text-align:

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

CSS hat eine text-align: centerEigenschaft, und da dies eine rein visuelle und keine semantische Sache ist, sollte es auf CSS und nicht auf HTML verwiesen werden.

Denkanstöße: Womit würde ein Text-zu-Sprache-Synthesizer umgehen <center>?

Sie können dies zu Ihrem CSS hinzufügen und verwenden <div class="center"></div>

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

oder wenn Sie behalten <center></center>und vorbereitet sein möchten, falls es jemals entfernt wird, fügen Sie dies Ihrem CSS hinzu

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

Die am wenigsten beliebte Antwort

1. Ein veraltetes Tag ist nicht unbedingt ein schlechtes Tag.
2. Es gibt Tags, die sich mit Präsentationslogik befassen, centerist eines davon;
3. Ein centerTag ist nicht dasselbe wie ein div mit text-align:center;
4. Die Tatsache, dass Sie eine andere Möglichkeit haben, etwas zu tun, macht es nicht ungültig.

Lassen Sie mich das erklären, denn hier gibt es berüchtigte Downvoter, die glauben, ich verteidige HTML4 der alten Schule oder so. Nein, bin ich nicht. Aber die Debatte centerist einfach ein Trendkrieg, es gibt keinen wirklichen Grund, ein Etikett fallen zu lassen, das einem gültigen Zweck gut dient.

Schauen wir uns also die Hauptargumente dagegen an.

• "Es beschreibt Präsentation, nicht Semantik!"
  Nein. Es beschreibt eine logische Anordnung - und ja hat ein Standard-Erscheinungsbild, genau wie andere Tags mögen<p>oder<ul>tun. Der Punkt ist jedoch die Beziehung des eingeschlossenen Teils zu seiner Umgebung. Das Zentrum sagt, "dies ist etwas, was wir durch visuell unterschiedliche Positionierung trennen".

• "Es ist nicht gültig"
  Ja, das ist es. Es ist nur veraltet, wie in, könnte später entfernt werden . Seit mehr als 15 Jahren. Und es geht anscheinend nirgendwo hin. Es gibt große Websites, die dieses Tag verwenden, da es sehr gut lesbar und auf den Punkt gebracht ist.

• "Es wird in HTML5 nicht unterstützt"
  Esist tatsächlicheines der am häufigsten unterstützten Tags.

• "It's oldschool"
  Schnürsenkel sind auch oldschool. Neue Methoden machen die alten nicht ungültig. Sie möchten sich progressiv und modern fühlen: gut. Aber mach es nicht zum Gesetz.

• "Es ist dumm / umständlich / lahm / erzählt eine Geschichte über dich"
  Keine davon. Es ist wie ein Hammer: ein Werkzeug für einen bestimmten Job. Es gibt andere Tools für denselben Job und andere Jobs für dasselbe Tool. Aber es wurde erstellt, um ein bestimmtes Problem zu lösen, und dieses Problem gibt es immer noch, sodass wir genauso gut eine dedizierte Lösung verwenden können.

• "Sie sollten dies nicht tun, weil CSS" Die
  Zentrierung kann absolut durch CSS erreicht werden, aber das ist nur eine Möglichkeit, nicht die einzige, geschweige denn die einzig geeignete . Alles, was unterstützt, funktioniert und lesbar ist, sollte in Ordnung sein.

TL; DR:

Der einzige Grund, nicht zu verwenden, <center>ist, weil die Leute dich hassen werden.