Comment obtenir un caractère de tabulation?

123

En HTML, il n'y a pas de caractère pour un onglet, mais je ne comprends pas pourquoi je peux copier et coller un ici:. (Vous ne pouvez pas voir toute la largeur de celui-ci, mais si vous cliquez pour modifier ma question, vous verrez le caractère.) Si je peux copier et coller un caractère de tabulation, il devrait y avoir un équivalent Unicode qui peut être codé en html . Je sais que cela n'existe pas, mais c'est un mystère que je n'ai jamais pu saisir.

Ma question est donc la suivante: pourquoi n'y a-t-il pas de caractère Unicode pour un onglet même si je peux le copier et le coller?

html Abbaye Graebner
la source
7
Voici un caractère de tabulation pour vous: "". Envoyez-moi un texto si vous avez besoin d'autres personnages! J'ai aussi des espaces, des tirets et des lettres grecques!
madhead
Sous Unix: Ctrl + Maj + U puis 9 pour le caractère de retrait.
neverMind9
StackOverflow brouille le texte des commentaires plus sévèrement que les questions ou les réponses. ``, '' et "" étaient des caractères TAB collés, cités de différentes manières.
MarkHu

Réponses:

165

Bien sûr, il existe une entité pour les onglets:

	

(L'onglet est le caractère ASCII 9 ou Unicode U + 0009.)

Cependant, tout comme les tabulations littérales (celles que vous saisissez dans votre éditeur de texte), tous les caractères de tabulation sont traités comme des espaces par les analyseurs HTML et réduits en un seul espace, sauf ceux d'un <pre>bloc, où les tabulations littérales seront rendues sous forme de 8 espaces dans un police monospace.

josh3736
la source
1
C'est intéressant, mais s'il s'agit d'un caractère Unicode, alors html ne devrait pas du tout le changer (le réduire), n'est-ce pas?
Abbey Graebner
2
Unicode n'a pas son propre caractère de tabulation; U + 0009 est le même que le caractère de tabulation obtenu en appuyant sur Tab. (Je pense que vous pourriez confondre les entités HTML avec le jeu de caractères Unicode.)
josh3736
9
plus généralement, vous pouvez utiliser & # 9; dans n'importe quel élément avec espace blanc de style CSS: pre; comme dans jsfiddle.net/cancerbero_sgx/sp269/3
cancerbero
96

Essayer &emsp;

selon les docs:

Les entités de caractère &ensp;et &emsp;désignent respectivement un espace en et un espace em, où un espace en est la moitié de la taille en points et un espace en em est égal à la taille en points de la police actuelle. Pour les polices à pas fixe, l'agent utilisateur peut traiter l'espace en comme étant équivalent à un caractère d'espace, et l'espace em comme étant équivalent à deux caractères d'espace.

Lien vers la documentation: https://www.w3.org/MarkUp/html3/specialchars.html

Abhishek Goel
la source
48

placez-le entre les <pre></pre>balises puis utilisez ces caractères&#9;

cela ne fonctionnerait pas sans les <pre></pre>balises

Raymund
la source
4
D'accord, c'est génial, j'essayais de l'utiliser &#9;seul, mais cela n'a pas fonctionné. Merci d'avoir mentionné <pre>!
Abbey Graebner
1
Excellente suggestion. Pourquoi exactement se comporte-t-il ainsi?
pkanane
1
la balise <pre> définit le texte préformaté tout emplacement de texte à l'intérieur de la balise conservera les espaces, les sauts de ligne, les tabulations, etc. Il sera généralement affiché dans un type de police à largeur fixe comme Courier
Raymund
2
Vous pouvez utiliser n'importe quelle balise html avec une combinaison de white-space: pre-wrap;ouwhite-space: pre;
Petr Hurtak
16

Poster une autre alternative pour être plus complet. Quand j'ai essayé les réponses basées sur «pré», ils ont également ajouté des sauts de ligne verticaux supplémentaires.

Chaque onglet peut être converti en une séquence d'espaces insécables qui ne nécessitent aucun habillage. 

"&nbsp;&nbsp;&nbsp;&nbsp;"

Ceci n'est pas recommandé pour une utilisation répétée / étendue dans une page. Une approche de marge / padding div semble beaucoup plus propre.

crokusek
la source
5
Si les onglets sont utilisés comme outil pour aligner le texte à droite des onglets (où le texte de police de largeur non fixe à gauche n'est pas égal), la conversion en caractères nbsp ne résoudra pas le problème.
Steve Midgley
4

J'utilise <span style="display: inline-block; width: 2ch;">&#9;</span>pour un onglet large de deux caractères.

GrayFace
la source
Ce n'est pas la même chose que les onglets, il s'agit simplement d'ajouter un espace blanc, donc il n'y a pas de colonnes avec cela.
Salami
1

La tabulation est [HT], ou le caractère numéro 9, dans la bibliothèque Unicode.

DanRedux
la source
1

Comme mentionné, pour des raisons d'efficacité, les espaces séquentiels sont regroupés en un seul espace que le navigateur affiche réellement. Rappelez-vous ce que signifie le ML en HTML. C'est un langage de balisage, conçu pour contrôler la façon dont le texte est affiché .. pas les espaces: p

Pourtant, vous pouvez prétendre que le navigateur respecte les onglets, car tout ce que fait la tabulation est d'ajouter 4 espaces au début, et c'est facile avec CSS. soit en ligne comme ...

 <div style="padding-left:4.00em;">Indenented text </div>

Ou en classe ordinaire dans une feuille de style

.tabbed {padding-left:4.00em;}

Ensuite, le HTML pourrait ressembler à 

<p>regular paragraph regular paragraph regular paragraph</p>
<p class="tabbed">Indented text Indented text Indented text</p>
<p>regular paragraph regular paragraph regular paragraph</p>
Duane Lortie
la source
1
Ce n'est pas ce que fait un onglet. Les onglets alignent le contenu, - sur une ligne, il peut ajouter 3 espaces et sur un autre 4. Conceptuellement, il déplace le curseur vers la tabulation suivante.
BrainSlugs83