How To: CSS und UTF-8

Publiziert am 23. Juli 2010 von H.-Peter Pfeufer

Wieder einmal ein Artikel, welcher aus einem Suchbegriff – gesucht wurde nach “smarty utf 8 css” – entstand.

Hierzu sei gesagt, das es keinen Unterschied macht, ob man dafür die Smarty-Template Engine nutzt oder nicht. CSS bleibt CSS. Aber wie bringt man CSS nun UTF-8 bei?

1	@charset "utf-8";

Dies als erste Zeile im CSS unterbringen. Das wars dann auch schon.

Ach ja, bevor ich es vergesse, der Sinn und Zweck dieser Angabe im CSS ist übrigens beim W3C nachzulesen. Die haben einen Artikel namens “Angabe der Zeichencodierung in CSS” auf ihrer Seite veröffentlicht.

Viel Spaß

Über H.-Peter Pfeufer

Ich bin Webentwickler/ -programmierer aus Leidenschaft, WordPressbegeistert und ab und an auch mal ein netter Mensch.
Vor allen schreibe ich über alles was mit den Themen Webentwicklung/ -programmierung und WordPress zu tun hat. Nebenher auch mal einige Gedanken zu allgemeineren Themen.

Zeige alle Beiträge von H.-Peter Pfeufer →

Kategorie(n): CSS
Tags: CSS, HowTo, UTF-8
Setze ein Lesezeichen auf den Permalink.

2 Antworten auf How To: CSS und UTF-8

Jan sagt:
23. Juli 2010 um 17:46

Ich habe ehrlich gesagt bisher noch keinen sinnvollen Grund für diese Angabe gefunden, immer nur einen speziellen Grund dagegen. Die charset-Angabe darf nämlich zwingend nur in der ersten eingebundenen CSS-Datei stehen (in jeder nachfolgenden führt sie zu einem Validitätsfehler). Dies hat man jedoch nicht immer unter Kontrolle, weswegen ich lieber auf die Angabe verzichte.

Antworten
H.-Peter Pfeufer sagt:
23. Juli 2010 um 20:19

Hallo Jan,

Ach das hat man schon unter Kontrolle.

1
2
3
4
5
/* main.css*/
@charset "utf-8";
@import url("style-1.css") screen;
@import url("style-2.css") screen;
@import url("style-3.css") screen;

Eingebunden wird dann lediglich die main.css. Und schon hast Du auch die Reihenfolge festgelegt. Und der Grund für @charset steht übrigens in dem verlinkten Artikel.

Die Information über die Zeichencodierung ist besonders wichtig, wenn sich CSS-Selektoren auf Elementbezeichner, Attributbezeichner oder Attributwerte beziehen, die nicht reiner ASCII-Text sind. Auch wenn die Werte von solchen CSS-Eigenschaften wie content oder font-family Nicht-ASCII-Zeichen enthalten, sollte die Zeichencodierung unbedingt angeben werden.

Antworten