是否可以在HTML中插入一个制表符，而不必键入 四次吗?
阿菲克，唯一的办法就是使用
如果你可以使用CSS，那么你可以使用填充或边距。参看Box模型，而对于ie浏览器，也可参阅ie浏览器的Box模型bug。
不，就HTML而言，Tab只是空白。我推荐一个这么大的em-space(→| |←)…通常是4个空格宽，输入为 
如果幸运的话，您甚至可以使用Unicode字符(" ")来表示它。
下面是Unicode中空格字符和“零宽度空格”的列表。
这取决于您想要使用的字符集。
在ISO-8859-1 HTML中没有定义制表符实体，但是除了 如 ， & enp;和 。
在ASCII中，	是一个标签。
以下是Wikipedia上HTML实体的完整列表和关于空格的有用讨论。
在段落中插入多个空格(或在段落中间)确实没有什么简单的方法。那些建议你使用CSS的人没有抓住重点。您可能不总是试图从一个侧面缩进一个段落，但实际上，尝试在它的特定位置放置额外的空格。
In essence, in this case, the spaces become the content and not the style. I don't know why so many people don't see that. I guess the rigidity with which they try to enforce the separation of style and content rule (HTML was designed to do both from the beginning - there is nothing wrong with occasionally defining style of an unique element using appropriate tags without having to spend a lot more time on creating CSS style sheets and there is absolutely nothing unreadable about it when it's used in moderation. There is also something to be said for being able to do something quickly.) translates to how they can only consider whitespace characters as being used only for style and indentation.
当没有优雅的方式插入空格，而不必依赖 和,标签，我认为，如果有一个适当命名的标签，允许您快速插入大量的空格(或者如果，您知道，空格一开始就没有被不必要地消耗)，那么结果代码将变得更加不可读。
尽管如此，正如上面所说，您最好的选择是使用 插入:插入正确的位置
使用CSS和最佳实践，嵌套、缩进菜单的动态创建如下:
为每个嵌套创建一个样式，如indent1, indent2等，每个嵌套都指定自己的左边距。站点结构应该很少超过三层嵌套。 在自递归函数中使用静态变量(整数)来跟踪递归。 对于每个循环，使用服务器端脚本(如PHP或ASP)将循环号附加到单词indent后，以便这些菜单通过CSS进行适当的格式化。
或者，循环静态变量，使用多个 或<pre>标记，或其他字符，视情况而定。
从测试水平制表符，	我发现它不能作为多种 在我描述的场景中。你可能会得到不同的结果。
在CSS中有这个:
span.tab{
padding: 0 80px; /* Or desired space*/
}
然后在你的HTML有这是你的“长标签”在句子中间，就像我需要的:
<span class="tab"></span>
节省 或 这是你需要的。
我已经使用了一个span与行内样式。我不得不这样做，因为我正在处理一个纯文本字符串，需要用4个空格(appx)替换\t。我不能使用 在进一步的过程中，它们被解释，所以最后的标记有非内容空间。
HTML:
<span style="padding: 0 40px"> </span>
我在一个php函数中使用了它:
$message = preg_replace('/\t/', '<span style="padding: 0 40px"> </span>', $message);
只有“pre”标签:
<pre>Name: Waleed Hasees
Age: 33y
Address: Palestine / Jein</pre>
你可以在这个标签上应用任何CSS类。
我只想建议:
/* 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>
最好使用pre标签。pre标记定义预格式化文本。
<pre>
This is
preformatted text.
It preserves both spaces
and line breaks.
</pre>
了解更多关于前标签在这个链接
您可以使用一个表并将width属性应用于第一个<td>。
<table>
<tr>
<td width="100">Content1</td>
<td>Content2</td>
</tr>
<tr>
<td>Content3</td>
<td>Content4</td>
</tr>
</table>
结果
Content1 Content2
Content3 Content4
 这就是答案。
然而，如果你习惯于在Word、Wordperfect、Open Office、Wordworth等文字处理软件中使用水平表格，那么它们的功能就不会像你预期的那样强大。它们是固定宽度的，不能定制。
CSS为您提供了更大的控制，并在W3C提供官方解决方案之前提供了替代方案。
例子:
padding-left:4em
…或…
margin-left:4em
．．适当的
这取决于您想要使用的字符集。
你可以设置一些标签，并像使用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>
.．.像这样使用它们:
<!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>
运行上面的代码片段以查看一个可视化示例。
额外的讨论
在ISO-8859-1 HTML中没有定义水平表格实体，但是除了通常的 之外，还有一些其他可用的空白字符，例如;&ensp  ;和前面提到的 。
值得一提的是，在ASCII和Unicode中，	是一个水平表格。
如果您只需要一个选项卡，那么下面的选项卡对我有用。
<style>
.tab {
position: absolute;
left: 10em;
}
</style>
使用HTML的内容如下:
<p><b>asdf</b> <span class="tab">99967</span></p>
<p><b>hjkl</b> <span class="tab">88868</span></p>
你可以添加更多的“标签”通过添加额外的“标签”样式和改变HTML，如:
<style>
.tab {
position: absolute;
left: 10em;
}
.tab1 {
position: absolute;
left: 20em;
}
</style>
使用HTML的内容如下:
<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='display:inline-block;height:1em;width:4em;'> </span>
如果写的内容太多，或者在很多地方都需要这样的制表符，那么您可以这样做
<span class='tab'> </span>
然后将其包含到CSS中:
span.tab {display:inline-block;height:1em;width:4em;}
 ， & enp;，  或& # 8194;可以使用。
W3说……
字符实体和分别表示一个en空格和一个em空格，其中en空格是点大小的一半，em空格等于当前字体的点大小。
HTML3的更多信息请访问W3.org
HTML4请在W3.org上阅读更多内容
维基百科上更多
<head>
<style> t {color:#??????;letter-spacing:35px;} </style>
</head>
<t>.</t>
确保颜色代码与背景相匹配 px可以根据制表符所需的长度变化。
然后在< t >后添加文本。< /t >
句号用作空格符，更容易输入，但'& #160;'也可以用来代替句号，因此颜色编码是不相关的。
<head>
<style> t {letter-spacing:35px;} </style>
</head>
<t> </t>
这主要用于显示文本段落，但在脚本的其他部分也可能有用。
尽管在HTML3中引入了<tab>标签，但它从未进入浏览器。我一直认为这是一种遗憾，因为如果我们拥有它，在许多情况下生活会轻松得多。但是你可以很容易地纠正这个错误，给你一个假的<tab>标签。在你的HTML头部或CSS中添加以下内容(没有样式标签):
<style>
tab { padding-left: 4em; }
</style>
从那时起，当你需要在你的文档中添加一个选项卡时，把<tab>放在那里。它不是一个真正的制表符，因为它不与制表符标记对齐，但它可以满足大多数需求，而不必为笨拙的字符实体或跨度而犹豫不决。它使检查源代码变得非常容易，并且在你不想使用表格或其他更复杂的“解决方案”的地方格式化简单的东西。
这个解决方案的一个优点是，您可以快速搜索/替换文本文档，用<tab>标记替换所有tab。
你可以定义一堆真正的绝对位置制表符，然后在需要的地方使用适当的制表符(例如<tab2>或<tab5>或其他)，但我还没有找到一种方法来做到这一点，而不缩进后续行。
我使用一个不带项目符号的列表来呈现“标签”外观。 (这是我在使用MS Word时有时会做的事情)
在CSS文件中:
.tab {
margin-top: 0px;
margin-bottom: 0px;
list-style-type: none;
}
并且在HTML文件中使用无序列表:
This is normal text
<ul class="tab">
<li>This is indented text</li>
</ul>
这个解决方案的美妙之处在于，您可以使用嵌套列表进一步缩进。
一个新手在这里说话，所以如果有任何错误，请评论。
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>
呈现
这不是一个直接的答案，但我想在Markdown文档中添加一个标签。我画了一个这样的对象图:
--Parent
|
+ Child 1
当然，简单的方法是通过缩进4个空格将其标记为代码，然后在Markdown中将其视为代码。
--Parent
|
+ Child 1
我们可以像这样使用style="white-space:pre":
<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>
里面的空白处填满了制表符，制表符的数量取决于文本。
它看起来是这样的:
Text : value
Text2 : value2
Text32 : value32
理想的CSS代码应该是“display”和“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.
我们使用自定义空间跨度类
<span class='space'></span>
在CSS中包含空间类。
.space
{
margin-left:45px;
}
&nbsp单位与字体大小有关。为了理解这种依赖关系，使用CSS/HTML方法考虑em和rem度量单位。
CSS
.tab { margin-left: 1rem; }
HTML
<div class=“tab> ...p and h elements... </div>
显示
1em约等于4 但是,Em unit和&nbsp rem unit的显示取决于元素和样式的使用，像这样缩进。
--------h1 indented 1em
--p indented 1em
----h1 indented 1rem
----p indented 1rem
左边距和左填充都有效。在HTML或CSS中没有标签长度单位。可以使用.tab类选择器。
如果你想要这些标签
像制表员一样工作，即使是在内容表中 不想用难看的“pre”字体
然后使用:
<pre class='TAB'>	</pre>
把它放在你的CSS中:
.TAB {
margin:0; padding:0;
display:inline;
tab-size: 8;
}
根据需要更改制表符大小。
p {background-color: #FFEEEE;保证金:0;填充:0.5em 0;｝ < span style=" font - family:宋体;tab-size: 4 " > & # 9 # 9 & # 9←←一个选项卡两个标签# 9 & # 9 & # 9←三个标签# 9 & # 9 & # 9 & # 9←四个选项卡。< / p > < span style=" font - family:宋体;tab-size: 4">←这是一个字符 < span style=" font - family:宋体;</p> . tab-size: 42">	←This one has come out too far.</p> . < span style=" font - family:宋体;tab-size: 8">	←说!</p>
太懒了;没有“运行代码”):
通过输入	在文本中插入制表符，或者(如果您确定文档是UTF-8编码的)按下制表键! 添加空白:预换行;到文本元素的CSS规则，以阻止空格字符(包括制表符)折叠。 添加tab-size: 4;到你的文本元素的CSS规则，以确保你的制表符宽度等于四个标准空格字符。
(在众多的回答和评论中，每一件事都有一些片段和线索，但没有一个像它的措辞那样把它们放在一起来回答这个问题。)
编辑:不幸的是，堆栈代码段将我的Unicode制表符转换为空格!因此，演示的这一部分(第2行)不起作用。如果通过代码格式化器运行代码，可能会遇到类似的问题。	避免了这些问题。
