Der beste Weg, um ein Grad-Celsius-Symbol in eine Webseite zu kodieren?

85

Wie soll ich Sonderzeichen in Webseiten kodieren? Zum Beispiel brauche ich dieses Symbol ℃, das ich nur durch Kopieren und Einfügen des Zeichens verwendet habe, so wie ich es jetzt sehen kann. Dies funktionierte für die Desktop-Browser, mit denen ich nachgesehen habe, sowie für iPad und iPhone, aber auf einem Blackberry, den ich zum Testen verwendet habe, wird nichts angezeigt. Gibt es dafür eine Standard-Best Practice?

http://www.fileformat.info/info/unicode/char/2103/browsertest.htm

html symbols Evanss
quelle
Gibt es einen Standard, der darüber nachdenkt, was zu verwenden ist, UTF-8 gegen Hex oder ein anderes Format? Danke
Evanss
Ah, sorry, habe deine Frage zuerst nicht verstanden. Ich glaube, dass UTF-8 im Allgemeinen bevorzugt wird. Was das Symbol selbst betrifft, mache ich normalerweise nur das Gradzeichen, gefolgt von einem Großbuchstaben C, wie folgt: ° C. Ich bin mir nicht sicher, ob dies besser oder schlechter ist als Ihre Lösung. Ich denke, der größte Unterschied ist der Buchstabenabstand zwischen den beiden Zeichen.
Nix
Ich denke, es ist notwendig, dass dieses Symbol es auf Ihre Weise tut. Danke
Evanss

Antworten:

177

Versuchen Sie, es durch zu ersetzen °und den Zeichensatz auf utf-8 zu setzen, wie Martin vorschlägt.

°C bekommst du so etwas:

Grad Celsius

Nix
quelle
Beste Antwort, meiner Meinung nach
Epirocks
Das ist perfekt!
Zobia Kanwal
37

Wenn Sie das DEGREE CELSIUS-Zeichen "℃" wirklich verwenden möchten, ist das Kopieren und Einfügen in Ordnung, vorausgesetzt, Ihr Dokument ist UTF-8-codiert und in HTTP-Headern als solches deklariert. Die Verwendung der Zeichenreferenz ℃würde genauso gut funktionieren und unabhängig von der Zeichencodierung funktionieren, aber die Quelle wäre viel weniger lesbar.

Das Problem mit Blackberry ist höchstwahrscheinlich ein Schriftproblem. Ich weiß nichts über Schriftarten auf Blackberry, aber das Schriftartenrepertoire ist möglicherweise begrenzt. In HTML können Sie nichts dagegen tun, aber Sie können CSS verwenden, möglicherweise mit @font face.

Es gibt jedoch selten einen Grund, den DEGREE CELSIUS zu verwenden. Es ist ein Kompatibilitätszeichen, das aufgrund seiner Verwendung in ostasiatischen Schriften in Unicode enthalten ist. Der Unicode-Standard sagt in Kapitel 15 (Abschnitt 15.2, Seite 497) ausdrücklich :

"Bei normaler Verwendung ist es besser, Grad Celsius" ° C "mit einer Folge von U + 00B0 Gradzeichen + U + 0043 lateinischem Großbuchstaben c darzustellen, als U + 2103 Grad Celsius."

Das Gradzeichen "°" kann auf viele Arten eingegeben werden, einschließlich der Entitätsreferenz "°". Normalerweise ist es jedoch am besten, es als Zeichen einzufügen, per Kopieren und Einfügen oder auf andere Weise. Unter Windows können Sie Alt 0176 verwenden.

Vorsichtsmaßnahme: Einige Browser behandeln das Gradzeichen möglicherweise so, dass ein Zeilenumbruch danach zulässig ist, auch wenn kein Leerzeichen dazwischen liegt, und setzen "°" und das folgende "C" in separate Zeilen. Es gibt verschiedene Möglichkeiten, dies zu verhindern . Eine einfache und effektive Methode ist folgende : <nobr>42 °C</nobr>.

Jukka K. Korpela
quelle
1
Eine der besten Antworten, die ich gelesen habe, mit direktem Zitat aus der Schlüsselquelle. Genial!!
htm11h
1
Warum überhaupt so kompliziert? Der Grad Celsius befindet sich oben links auf meiner Tastatur. Drücken Sie einfach darauf.
Pascal
2
@Pascal, welche Tastatur könnte das sein?
Jukka K. Korpela
Verwenden Sie style = "white-space: nowrap" anstelle von <nobr>. developer.mozilla.org/en-US/docs/Web/HTML/Element/nobr
IceWarrior353
10

Verwenden Sie sup für den Buchstaben "o" und ein Großbuchstaben "C".

<sup>o</sup>C
Erweitern Sie das Snippet

Sollte in allen Browsern und IE6 + funktionieren

Persijn
quelle
11
Der Buchstabe «o» ist nicht das Gradsymbol, aber er könnte wie das Gradsymbol für Menschen aussehen . Dies ist ein Hack und wird für Computer verwirrend sein - wie Bildschirmleser und Suchmaschinen.
Gregers
4

Fügen Sie Ihrem Header ein Metatag hinzu

<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />

Dies erweitert die Anzahl der Zeichen, die Sie verwenden können.

Martin Risell Lilja
quelle
5
In HTML5 können Sie einfach verwenden, <meta charset="utf-8"/>glaube ich.
Drew Noakes
In meinem Fall war dies die wirkliche Lösung. VS2015 verhält sich entsprechend dem Meta-Tag "Content-Type".
Deutscher Latorre
Das Hinzufügen dieses Problems löste für mich ein Problem, bei dem a °wie °in einem imgAlt-Tag gerendert wurde, in dem das Quellbild fehlte.
StephenT
1
  1. Das Gradzeichen gehört zur Zahl und nicht zum "C". Sie können das Gradzeichen ebenso wie das Minuszeichen als Zahlensymbol betrachten.
  2. Zwischen den Ziffern und dem Gradzeichen darf kein Leerzeichen stehen.
  3. Es wird ein non-breaking Raum zwischen den Grad - Zeichen und dem „C“ sein.
Johan Hoffsten
quelle
Könnten Sie eine Quelle für diese Behauptungen angeben?
Matthieu
0

Wenn Sie Java-JSP verwenden, haben Sie unten in die JSP-Seite eingefügt

<%@ page contentType="text/html; charset=UTF-8" %>
veritas
quelle