Ich habe eine Situation wie folgt
& lt; Körper & gt;
Test & lt; br / & gt;
Test & lt; br / & gt;
test1 & lt; br / & gt;
& lt; / body & gt;
Ich muss nach dem 2. Test und dem 3. Test ein Tab hinzufügen
, damit es ähnlich aussieht.
Test
testen
test1
Gibt es eine spezielle HTML-Entität oder ein Sonderzeichen für TAB? z.B. Nicht brechendes Leerzeichen == & amp; nbsp;
Danke
Der einfachste Weg, den ich mir vorstellen kann, wäre, den Text in verschachtelte divs zu platzieren. Dann füge den Rand links von div hinzu. Es wird kaskadieren und Ihnen Einrückung geben.
%Vor%Mit dem CSS:
%Vor%Mit diesen erhalten Sie einen schönen Baum, egal wie tief Sie gehen möchten.
BEARBEITEN: Sie können padding-left
auch verwenden, wenn Sie möchten.
Wenn Sie wirklich Tabs (== Tabulatorzeichen) verwenden möchten, müssen Sie mit der folgenden Lösung gehen, die ich nicht empfehle:
%Vor% oder ersetzen Sie <pre/>
durch <div style="white-space: pre" />
, um den gleichen Effekt wie mit dem pre-Element zu erzielen. Sie können sogar ein Literalzeichen anstelle des Escaped 	
eingeben.
Ich empfehle es nicht für die meisten Verwendungen, weil es nicht wirklich semantisch ist, das heißt, aus der Betrachtung der HTML-Quelle kann ein Programm keine nützliche Information ableiten (wie z.B. "dies ist eine Überschrift" oder so). Du solltest besser eines der netten margin-left
Beispiele der anderen Antworten verwenden. Wenn Sie jedoch etwas wie Quellcode oder dergleichen anzeigen möchten, würde die obige Lösung es tun.
Prost,
Es gab bisher eine Vielzahl von guten und schlechten Antworten, aber es scheint, dass niemand die Art und Weise angesprochen hat, wie Sie zwischen den Lösungen wählen können.
Die erste Frage ist "Welche Beziehung besteht zwischen den angezeigten Daten?" . Sobald dies beantwortet wurde, sollte die HTML-Struktur, die Sie verwenden, offensichtlich sein.
Bitte aktualisieren Sie die Frage, in der Sie mehr über die Struktur des anzuzeigenden Inhalts erfahren, und Sie sollten feststellen, dass Sie bessere Antworten erhalten. Im Moment kann alles von der Verwendung von <pre>
zu Tabellen die beste Lösung sein.
Ich denke, dass es am einfachsten ist, UL / LI-HTML-Tags zu verwenden und dann die Symbole vor der Liste mit CSS zu manipulieren (und bei Bedarf zu entfernen).
Dann bekommst du etwas wie:
Weitere Informationen + Arbeitsbeispiel können Sie ausprobieren.
Siehe Erstellen eines Tabs in HTML von Neha Sinha:
Vorformatiert
Sie können Tab-Zeichen direkt in Ihren HTML-Code einfügen, wenn Sie verwenden, was "vorformatiert" genannt wird text.In HTML, Surround-Text, den Sie will "vorformatiert" in einem Paar "% Co_de%" und "
<pre>
" beginnen und enden Tags.Tabellen
Sie können eine HTML-Tabelle verwenden, so dass alles, was Sie in den Satz von Zeilen (
</pre>
) und Spalten (<tr>
) erscheinen auf die gleiche Weise. Sie können die Tabellenrahmen sehr gut ausblenden, um den Text allein anzuzeigen.Verwendung des
<td>
-TagsDas
<dd>
-Tag dient zum Formatieren von Definitionen. Aber es wird auch einen Zeilenumbruch erstellen und machen ein Tab!
<dd>
, Der nichtbrechende PlatzEin Bit HTML-Code, den ich im Beispiel der Tabelle verwendet habe, ist der "non-breaking space", der wie in HTML kodiert ist. Das gibt dir nur etwas Platz. In Kombination mit einem Zeilenumbruch,
, können Sie tab-ähnliche Effekte erstellen.
Dies sollte wie folgt dargestellt werden:
%Vor% Wenn Sie Registerkarten (Tabulatorzeichen) anzeigen müssen, verwenden Sie ein PRE
-Element (oder ein beliebiges Element, auf das das white-space: pre;
CSS angewendet wurde).
Sie können auch die HTML-Entity 	
anstelle des eigentlichen Tab-Zeichens verwenden.
Ich weiß, dass dies ein alter Beitrag ist, aber jemand möchte vielleicht die folgende Liste verwenden, um eine eingerückte Liste zu erstellen (indem man ein Beschreibungsliste )
Meiner Meinung nach ist dies ein viel saubererer Weg als viele der anderen Antworten hier und könnte der beste Weg sein:
<pre>
-Tag, das nur für die Formatierung verwendet werden sollte (meiner Meinung nach sollte dies ein letzter Ausweg oder ein Sonderfall in HTML sein); <pre>
-Tag ist ebenfalls whitespace-abhängig und nicht CSS-abhängig, wenn es so verwendet wird, wie es verwendet werden soll
w3schools sagt zu , dass Sie das Element
<pre>
verwenden, wenn Sie Text mit ungewöhnlichen Formatierungen oder Ähnlichem anzeigen Art von Computercode .
<div>
s ermöglichen eine Stilkontrolle und je nach Verwendung / Zielsetzung kann seine Antwort der beste Weg