Wie richtet man Dezimalpunkte in HTML ohne zusätzliche Formatierung aus?

Dezimalpunkte in HTML ausrichten

Problem: Wie können numerische Werte in einer Tabelle vertikal in Bezug auf ausgerichtet werden? ihre Dezimalstellen, ohne zusätzliche Formatierungs-Tags einzuführen oder browserspezifischen Code zu verwenden?

Mögliche Lösungen:

• Zahlen aufteilen: Zahlen dividieren in Ganzzahlen und Dezimalzahlen mithilfe von HTML-Elementen umwandeln und den Dezimalpunkt mit einer expliziten Breite formatieren.
• Char-Spalte: Mit Syntax von HTML4. Dies wird jedoch von den gängigen Browsern nicht unterstützt.

Optimale Lösung:

Ein effektiverer und browserübergreifend kompatibler Ansatz ist die Verwendung des Unicode-Zeichens FIGURE SPACE (U 2007,  ).

FIGURE SPACE:

Der FIGURE SPACE ist ein Leerzeichen mit einer festen Breite zu dem der Ziffern. Der Abstand bleibt erhalten, ähnlich wie beim No-Break Space. Durch das Auffüllen von Zahlen mit FIGURE SPACES kann die Spalte oder das Div entweder auf der linken oder rechten Seite ausgerichtet werden.

Beispiele:

Linksbündige und links aufgefüllte Zahlen unter Verwendung von FIGURE SPACES:

<code class="html"><p style="font-family: sans-serif">
  10000<br>
  &#8199;&#8199;123.4<br>
  &#8199;&#8199;&#8199;&#8199;3.141592
</p>

<p style="font-family: serif">
  10000<br>
  &#8199;&#8199;123.4<br>
  &#8199;&#8199;&#8199;&#8199;3.141592
</p></code>

Diese Lösung ist überlegen, da sie:

• Zahlen genau an ihren Dezimalstellen ausrichtet.
• Funktioniert in allen Browsern und Schriftfamilien.
• Ermöglicht eine einfache Integration mit CSS für weiteres Styling.

Das obige ist der detaillierte Inhalt vonWie richtet man Dezimalpunkte in HTML ohne zusätzliche Formatierung aus?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!