HTML5 zentrieren (center) verboten!

Zentrien der Texte und Objekte mit HTML5

früher hat man einfach den CENTER Tag verwendet
um Texte oder Objekte innerhalb des HTML-Dokuments zu zentrieren.

Doch seit HTML5 gibt es den HTML-Tag Center nicht mehr.
Es wird also nicht mehr unterstützt,
und kann zu Browserkompatibilitätsproblem führen!

So war's früher (im HTML 4 in davor):


        <center>vor HTML 5 konnte man den so zentrieren </center>

Seit HTML5 muss man die Text und Objekt Zentrierung im HTML-Dokument mit CSS deffinieren

Die neue Zentrierung mit CSS geht im Grunde recht einfach,
und bietet zudem noch weitere Textformatierungs Möglichkeiten in den Style-Sheets an.

Alternativ zum alten HTML Center-Tag,
kann man einfach ein DIV, SPAN oder beliebigen Tag nehmen
und den Text oder das Objekt damit einbetten, Beispiel:


        <div style="text-align: center;">nun mit CSS im HTML 5 so zentrieren  </div>

        <span style="text-align: center;">nun mit CSS im HTML 5 so zentrieren  </span>



Jedoch empfehle ich den eingebetteten Elementen besser mur eine CSS-Class Zuweisung zu machen
und den CSS-Code in eine externe Datei auszulagern.
Wenn man die Cascading Style Sheets in eine externe Textdatei ausgelagert hat,
muss man dem HTML-Objekt nur den CLASS Bezeichner deffinieren.

Woraus sich hierbei automatisch wieder ein Vorteil ergibt,
wenn man neue CSS-Formatierungen implementieren möchte.

Die neuen Style-Sheets müssen dann nur an einer Stelle gändert werden,
wirken sich jedoch global,
also auf alle HTML-Dokumente aus, wo die entsprechende CSS-Class deffiniert wurde.

Hier ein Beispiel einer CSS Class innherhalb eines HTML-Dokuments:

         <<style type="text/css">
         <!--
         .myCenter{
                 text-align: center;
         }-->
         </style>

        <div class="myCenter">nun mit CSS im HTML 5 so zentrieren </div>

        <span class="myCenter">nun mit CSS im HTML 5 so zentrieren </span>



Und hier zum Beispiel:
Die CSS in eine externe Datei auslagern


Comments

No comments yet.

Add Comment

* Required information
(never displayed)
 
Bold Italic Underline Strike Superscript Subscript Code PHP Quote Line Bullet Numeric Link Email Image Video
 
Smile Sad Huh Laugh Mad Tongue Crying Grin Wink Scared Cool Sleep Blush Unsure Shocked
 
1000
Enter the third word of this sentence.
 
Enter answer:
Captcha
Refresh
 
Enter code:
 
Notify me of new comments via email.
 
Remember my form inputs on this computer.
 
I have read and understand the privacy policy. *
 
I have read and agree to the terms and conditions. *
 
 
Powered by Commentics