Espace de tabulation au lieu de plusieurs espaces insécables ("nbsp")?
Est-il possible d'insérer un caractère de tabulation en HTML au lieu de devoir taper quatre fois?
C'est beaucoup plus propre d'utiliser CSS. Essayez plutôt padding-left:5em ou margin-left:5em comme il convient.
Cela dépend du jeu de caractères que vous souhaitez utiliser.
Il n'y a pas d'entité de tabulation définie dans ISO-8859-1 HTML - mais il existe quelques caractères d'espacement autres que , tels que  ,   et  .
En ASCII, 	 est un onglet.
Ici est une liste complète des entités HTML et ne discussion utile des espaces sur Wikipedia .
Non, Tab est simplement espace en ce qui concerne HTML. Je recommanderais un em-space qui est ce gros (→ | | ←) ... généralement 4 espaces larges - et est entré sous la forme  .
Vous pourrez peut-être même vous en tirer en utilisant Unicode caractère ("_ _"), si vous avez de la chance.
- Voici une liste de Caractères d'espace et "espaces de largeur nulle" en Unicode .
emsp; est la réponse.
Cependant, ils ne seront pas aussi fonctionnels que vous le souhaiteriez si vous êtes habitué à utiliser des tabulations horizontales dans les processeurs de texte, par exemple. Word, Wordperfect, Open Office, Wordworth, etc. Ils ont une largeur fixe et ne peuvent pas être personnalisés.
CSS vous donne un contrôle bien plus important et offre une alternative jusqu'à ce que le W3C fournisse une solution officielle.
Exemple:
padding-left:4em
..ou..
margin-left:4em
.. comme approprié
Cela dépend du jeu de caractères que vous souhaitez utiliser.
Vous pouvez configurer certaines balises de tabulation et les utiliser de la même manière que vous utiliseriez les balises h.
<style>
tab1 { padding-left: 4em; }
tab2 { padding-left: 8em; }
tab3 { padding-left: 12em; }
tab4 { padding-left: 16em; }
tab5 { padding-left: 20em; }
tab6 { padding-left: 24em; }
tab7 { padding-left: 28em; }
tab8 { padding-left: 32em; }
tab9 { padding-left: 36em; }
tab10 { padding-left: 40em; }
tab11 { padding-left: 44em; }
tab12 { padding-left: 48em; }
tab13 { padding-left: 52em; }
tab14 { padding-left: 56em; }
tab15 { padding-left: 60em; }
tab16 { padding-left: 64em; }
</style>
... et les utiliser comme suit:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Tabulation example</title>
<style type="text/css">
dummydeclaration { padding-left: 4em; } /* Firefox ignores first declaration for some reason */
tab1 { padding-left: 4em; }
tab2 { padding-left: 8em; }
tab3 { padding-left: 12em; }
tab4 { padding-left: 16em; }
tab5 { padding-left: 20em; }
tab6 { padding-left: 24em; }
tab7 { padding-left: 28em; }
tab8 { padding-left: 32em; }
tab9 { padding-left: 36em; }
tab10 { padding-left: 40em; }
tab11 { padding-left: 44em; }
tab12 { padding-left: 48em; }
tab13 { padding-left: 52em; }
tab14 { padding-left: 56em; }
tab15 { padding-left: 60em; }
tab16 { padding-left: 64em; }
</style>
</head>
<body>
<p>Non tabulated text</p>
<p><tab1>Tabulated text</tab1></p>
<p><tab2>Tabulated text</tab2></p>
<p><tab3>Tabulated text</tab3></p>
<p><tab3>Tabulated text</tab3></p>
<p><tab2>Tabulated text</tab2></p>
<p><tab3>Tabulated text</tab3></p>
<p><tab4>Tabulated text</tab4></p>
<p><tab4>Tabulated text</tab4></p>
<p>Non tabulated text</p>
<p><tab3>Tabulated text</tab3></p>
<p><tab4>Tabulated text</tab4></p>
<p><tab4>Tabulated text</tab4></p>
<p><tab1>Tabulated text</tab1></p>
<p><tab2>Tabulated text</tab2></p>
</body>
</html>Exécutez l'extrait de code ci-dessus pour voir un exemple visuel.
Discussion supplémentaire
Il n’existe pas d’entités de tabulation horizontales définies dans la norme HTML ISO-8859-1; toutefois, il existe d’autres caractères d’espace blanc que le caractère habituel  , par exemple;  ,   et le   susmentionné.
Il est également intéressant de noter que dans ASCII et Unicode, 	 est une tabulation horizontale.
Essayez 
Cela équivaut à quatre s.
Vous trouverez ci-dessous les trois manières différentes fournies par HTML d'insérer un espace vide.
- Tapez
pour ajouter un seul espace. - Tapez
 pour ajouter 2 espaces. - Tapez
 pour ajouter 4 espaces.
Il n'y a pas vraiment de moyen facile d'insérer plusieurs espaces à l'intérieur (ou au milieu) d'un paragraphe. Ceux qui suggèrent que vous utilisez CSS manquent le point. Vous n'essayez peut-être pas toujours d'indenter un paragraphe d'un côté, mais en fait, vous essayez de placer des espaces supplémentaires dans un endroit particulier de celui-ci.
Dans ce cas, les espaces deviennent le contenu et pas le style. Je ne sais pas pourquoi tant de gens ne voient pas ça. Je suppose que la rigidité avec laquelle ils essaient de faire respecter la distinction de style et de règle de contenu (HTML a été conçu pour faire les deux à la fois - il n’ya aucun mal à définir occasionnellement le style d’un unique élément utilisant les balises appropriées sans avoir à passer plus de temps à la création de feuilles de style CSS et il n’ya absolument rien de illisible quand il est utilisé avec modération. Il ya aussi quelque chose à dire pour pouvoir faire quelque chose rapidement.) traduit comment ils peuvent uniquement considérer les caractères d'espacement comme utilisés uniquement pour le style et l'indentation.
Et quand il n’ya pas de moyen gracieux d’insérer des espaces sans avoir à compter sur les balises   et , je dirais que le code résultant devient beaucoup plus illisible que s’il existait une balise nommée de manière appropriée qui aurait vous permettait d'insérer rapidement un grand nombre d'espaces (ou si, vous savez, les espaces n'étaient pas inutilement consommés au départ).
Comme il a été dit plus haut, votre meilleur choix serait d’utiliser   pour l’insérer au bon endroit.
Il vaut mieux utiliser la balise pre . La balise pre définit le texte préformaté.
<pre>
This is
preformatted text.
It preserves both spaces
and line breaks.
</pre>
en savoir plus sur la pré-balise à ce lien
Je suis tombé sur cette idée en cherchant une méthode et j'ai fini par trouver la mienne qui semble fonctionner facilement pour ce qui est recherché. Je suis nouveau pour poster ici donc j'espère que cela fonctionne ... Mais ayez ceci en CSS:
span.tab{
padding: 0 80px; /* Or desired space*/
}
Ensuite, dans votre code HTML, indiquez cette "longue tabulation" au milieu de la phrase, comme je le souhaitais:
<span class="tab"></span>
Enregistre la quantité de ou   dont vous auriez besoin.
J'espère que cela aide quelqu'un, bravo!
 ,  ,   ou   peut être utilisé.
W3 dit ...
_The character entities   and   denote an en space and an em space respectively, where an en space is half the point size and an em space is equal to the point size of the current font.
_En savoir plus sur W3.org pour HTML
En savoir plus sur W3.org pour HTML4
Encore plus sur Wikipedia
Autant que je sache, le seul moyen est d'utiliser
Si vous pouvez utiliser CSS, vous pouvez utiliser un remplissage ou une marge. Voir modèle Box, et pour Internet Explorer, également lire Internet Bogue du modèle de la boîte d’exploration.
Si vous souhaitez simplement mettre en retrait la première phrase d'un paragraphe, vous pouvez le faire avec un petit truc CSS:
p:first-letter {
margin-left: 5em;
}
Si les espaces deviennent ça important, il peut être préférable d’utiliser du texte préformaté et la balise <pre>.
La balise <tab> n’a jamais été intégrée aux navigateurs, bien qu’elle ait été introduite dans HTML3. J'ai toujours trouvé cela vraiment dommage car la vie serait beaucoup plus facile dans de nombreuses circonstances si nous l'avions à notre disposition. Mais vous pouvez facilement remédier à cela pour vous donner une fausse balise <tab>. Ajoutez ce qui suit dans la tête de votre HTML ou sinon (sans les balises de style) dans votre CSS:
<style>
tab { padding-left: 4em; }
</style>
A partir de là, lorsque vous avez besoin d'un onglet dans votre document, insérez <tab> dans celui-ci. Ce n'est pas un véritable onglet, car il ne s'aligne pas sur les marques de tabulation, mais il répond à la plupart des besoins, sans avoir à utiliser des entités ou des étendues de caractères maladroits. Il est très facile de vérifier votre source et de formater des choses simples où vous ne voulez pas aller à la corvée de tables ou d’autres "solutions" plus complexes.
Un aspect intéressant de cette solution est que vous pouvez effectuer une recherche/remplacement rapide d’un document texte pour remplacer tous les onglets par la balise <tab>.
Vous pourrez peut-être définir un ensemble de véritables tabulations de positions absolues, puis utiliser l'onglet approprié (par exemple, <tab2> ou <tab5>) si nécessaire, mais je n'ai pas trouvé le moyen de le faire sans que les lignes suivantes ne soient indentées. .
Vous pouvez utiliser une table et appliquer un attribut width au premier <td>.
Code:
<table>
<tr>
<td width="100">Content1</td>
<td>Content2</td>
</tr>
<tr>
<td>Content3</td>
<td>Content4</td>
</tr>
</table>
Résultat
Content1 Content2
Content3 Content4
J'ai utilisé une travée avec un style en ligne. J'ai dû le faire en tant que traitement d'une chaîne de texte brut et je dois remplacer le\t par 4 espaces (appx). Je ne pouvais pas utiliser car plus loin dans le processus, ils étaient interprétés de sorte que la balise finale contienne des espaces non contenus.
HTML:
<span style="padding: 0 40px"> </span>
Je l'ai utilisé dans une fonction php comme ceci:
$message = preg_replace('/\t/', '<span style="padding: 0 40px"> </span>', $message);
Si vous n'aviez besoin que d'un seul onglet, les éléments suivants ont fonctionné pour moi.
<style>
.tab {
position: absolute;
left: 10em;
}
</style>
avec le HTML quelque chose comme:
<p><b>asdf</b> <span class="tab">99967</span></p>
<p><b>hjkl</b> <span class="tab">88868</span></p>
Vous pouvez ajouter d'autres "onglets" en ajoutant d'autres styles "onglets" et en modifiant le code HTML, par exemple:
<style>
.tab {
position: absolute;
left: 10em;
}
.tab1 {
position: absolute;
left: 20em;
}
</style>
avec le HTML quelque chose comme:
<p><b>asdf</b> <span class="tab">99967</span><span class="tab1">hear</span></p>
<p><b>hjkl</b> <span class="tab">88868</span><span class="tab1">here</span></p>
<span style="margin-left:64px"></span>
Considérez ceci comme ceci: un onglet équivaut à 64 pixels. C'est donc l'espace que nous pouvons donner par CSS.
Il y a un simple css pour cela:
white-space: pre;
Il conserve les espaces que vous ajoutez dans le code HTML plutôt que de les unifier.
Si vous utilisez CSS, je suggérerais ce qui suit:
p:first-letter { text-indent:1em; }
Cela indenterait la première ligne comme dans les publications traditionnelles.
Le code CSS idéal à utiliser devrait être une combinaison des propriétés "display" et "min-width" ...
display: inline-block;
min-width: 10em; // ...for example, depending on the uniform width to be achieved for the items [in a list], which is a common scenario where tab is often needed.
J'utilise une liste sans puces pour donner l'aspect "tabulé". (C'est ce que je fais parfois lorsque j'utilise MS Word)
Dans le fichier CSS:
.tab {
margin-top: 0px;
margin-bottom: 0px;
list-style-type: none;
}
Et dans le fichier HTML, utilisez des listes non ordonnées:
This is normal text
<ul class="tab">
<li>This is indented text</li>
</ul>
L'avantage de cette solution est que vous pouvez créer d'autres indentations à l'aide de listes imbriquées.
Un noob est en train de parler, alors s'il y a des erreurs, veuillez commenter.
nous pouvons utiliser style = "white-space: pre" comme ceci:
<p>Text<tab style="white-space:pre"> </tab>: value</p>
<p>Text2<tab style="white-space:pre"> </tab>: value2</p>
<p>Text32<tab style="white-space:pre"> </tab>: value32</p>
l'espace vide à l'intérieur est rempli d'onglets, la quantité d'onglets dépend du texte.
ça va ressembler à ça:
Text : value
Text2 : value2
Text32 : value32
nous utilisons une classe d'espace personnalisée
<span class='space'></span>
Inclure la classe d'espace en CSS.
.space
{
margin-left:45px;
}
Eh bien, si vous avez besoin d'un grand espace au début d'une ligne seulement du paragraphe entier, cela peut être une solution:
<span style='display:inline-block;height:1em;width:4em;'> </span>
Si c'est trop à écrire ou si on a besoin de tels onglets à plusieurs endroits, alors vous pouvez le faire
<span class='tab'> </span>
Ensuite, incluez ceci dans CSS:
span.tab {display:inline-block;height:1em;width:4em;}
En utilisant CSS et les meilleures pratiques, la création dynamique de menus imbriqués imbriqués serait la suivante:
- Créez un style pour chaque imbrication, tel que indent1, indent2, etc., chacun spécifiant sa propre marge gauche. La structure du site devrait rarement dépasser trois niveaux de nidification.
- Utilisez une variable statique (entier) dans la fonction auto-récursive pour suivre la récursion.
- Pour chaque boucle, ajoutez le numéro de boucle au mot
indent, à l'aide d'un script côté serveur tel que PHP ou ASP, afin que ces menus soient correctement formatés par CSS.
Vous pouvez également parcourir la variable statique pour ajouter un espacement à l'aide de plusieurs balises ou <pre>, ou d'autres caractères, selon le cas.
Après avoir testé le caractère de tabulation horizontale, 	, j’ai trouvé qu’il ne remplaçait pas plusieurs dans le scénario que j’ai décrit. Vous pouvez avoir des résultats différents.
CSS
<html>
<head>
<style>
tab:before
{
content: "\00a0\00a0\00a0\00a0";
}
</style>
</head>
HTML
<body>
<tab> #include < stdio.h > <br>
<tab> <br>
<tab> int main (void) <br>
<tab> { <br>
<tab> <tab> printf ("Hello, World!"); <br>
<tab> <tab> return 0; <br>
<tab> } <br>
</body>
</html>
rendu
Ce n'est pas une réponse directe mais je voulais ajouter un onglet dans le document Markdown. Je dessinais un graphe d'objets comme celui-ci:
--Parent
|
+ Child 1
Bien sûr, il est facile de le marquer comme code en indentant de 4 espaces et est ensuite traité comme code dans Markdown.
--Parent
|
+ Child 1
Seulement "pre" tag:
<pre>Name: Waleed Hasees
Age: 33y
Address: Palestine / Jein</pre>
Vous pouvez appliquer n'importe quelle classe CSS sur cette balise.
Vous pouvez aussi utiliser:
p::before {
content: "";
padding-left: 30px;
}
Et remplacez "p" par tout autre sélecteur que vous avez en tête.
<head>
<style> t {color:#??????;letter-spacing:35px;} </style>
</head>
<t>.</t>
Assurez-vous que le code de couleur correspond à l'arrière-plan du px est variable à la longueur souhaitée pour l'onglet.
Ajoutez ensuite votre texte après le <t>. </ T>
La période est utilisée comme un espace et il est plus facile de taper, mais le '& # 160;' peut être utilisé à la place de la période, ce qui fait que le codage de couleur n’est pas pertinent.
<head>
<style> t {letter-spacing:35px;} </style>
</head>
<t> </t>
Ceci est utile principalement pour afficher des paragraphes de texte, bien que cela puisse être utile dans d'autres parties de scripts.
Je recommanderais simplement:
/* In your CSS code: */
pre
{
display:inline;
}
<!-- And then, in your HTML code: -->
<pre> This text comes after four spaces.</pre>
<span> Continue the line with other element without braking </span>
Ceci est un peu une solution laide, mais vous pouvez simplement le faire
var tab = ' ';
Et utilisez ensuite la variable tab dans vos chaînes.