206

可能的方式：

<pre> ... </pre>

或者

style="white-space:pre"

还要别的吗？

4

18 回答 18

162

tab space在我通常使用的两个单词/句子之间插入

&emsp;和 &ensp;

于 2015-02-04T00:56:57.663 回答
127

在空间的宽度/高度超出&nbsp;我通常使用的情况下：

对于水平垫片：

<span style="display:inline-block; width: YOURWIDTH;"></span>

对于垂直垫片：

<span style="display:block; height: YOURHEIGHT;"></span>
于 2012-03-20T20:53:25.630 回答
64

您可以使用&nbsp;for 空格、&lt;for <（小于，实体编号&#60;）和&gt;for >（大于，实体编号&#62;）。

完整的列表可以在HTML Entities中找到。

于 2012-03-20T18:39:21.620 回答
48

试试&emsp;。

根据特殊字符的文档：

字符实体&ensp;和&emsp;分别表示一个 en 空间和一个 em 空间，其中一个 en 空间是磅值的一半，一个 em 空间等于当前字体的磅值。对于固定间距字体，用户代理可以将 en 空格视为等价于 A 空格字符，将 em 空格视为等价于两个空格字符。

于 2016-05-05T07:34:17.933 回答
26

SpacesHTML中的类型

在文本之间创建四个空格-&emsp;

在文本之间创建两个空格 -&ensp;

在文本之间创建一个常规空间 -&nbsp;

创建一个狭窄的空间（类似于常规空间但略有不同 - "&thinsp";

句子之间的间距 -"</br>"

此链接可能会对您有所帮助。查看 [ https://hea-www.harvard.edu/~fine/Tech/html-sentences.html]

于 2018-09-02T12:28:05.137 回答
23

我喜欢用这个：

在您的 CSS 中：

.tab { 
       display:inline-block; 
       margin-left: 40px; 
}

在您的 HTML 中：

<p>Some Text <span class="tab">Tabbed Text</span></p>
于 2015-06-29T04:30:53.943 回答
15 
<p style="text-indent: 5em;">
The first line of this paragraph will be indented about five characters, similar to a tabbed indent.
</p>

本段的第一行将缩进大约五个字符，类似于选项卡式缩进。

有关详细信息，请参阅如何使用 HTML 和 CSS 创建选项卡和间距。

于 2013-05-14T17:33:04.930 回答
8

比@Ivar 更进一步，并像这样设置我自己的自定义标签的样式......对我来说，“标签”更容易记住和输入。

tab {
    display: inline-block;
    margin-left: 40px;
}

和 HTML 实现...

<p>Left side of the whitespace<tab>Right side of the whitespace</p>

此代码示例的屏幕截图

还有我的截图...

于 2018-11-22T10:19:42.843 回答
6

<span style="padding-left:68px;"></span>

您还可以使用：

padding-left
padding-right
padding-top
padding-bottom
于 2014-06-23T05:35:08.817 回答
5

或者称为固定空间或硬空间，不间断空间(NBSP) 用于编程和文字处理，以在一行中创建一个不能被自动换行破坏的空间。

使用 HTML，&nbsp;允许您创建在网页上可见的多个空间，而不仅仅是在源代码中。

于 2018-11-17T05:54:54.377 回答
3

如果您要求制表符对齐某些行中的内容，您可以使用<table>.

将每一行放入<tr> ... </tr>. 并且该行内的每个元素在<td> ... </td>. 当然，您可以随时控制每个表格单元格的填充以调整它们之间的空间。

这将使它们对齐，它们看起来会很漂亮:)

于 2016-04-25T23:58:19.070 回答
3

您可以通过填充来完成<span style="padding-left: 20px;">，您可以在此处查看更多方法 - html 中的空格

于 2020-06-10T14:32:58.810 回答
2

使用标准 CSS tab-size。

要插入制表符（如果是标准制表键，则移动光标）按Alt+ 0+ 0+9

.element {
    -moz-tab-size: 4;
    tab-size: 4;
}

我的首选：

*{-moz-tab-size: 1; tab-size: 1;}

查看tab-size的代码片段或快速找到的示例。

.t1{
    -moz-tab-size: 1;
    tab-size: 1;
}
.t2{
    -moz-tab-size: 2;
    tab-size: 2;
}
.t4{
    -moz-tab-size: 4;
    tab-size: 4;
}
pre {border: 1px dotted;}
<h3>tab = {default} space</h3>
<pre>
	one tab text
		two tab text
</pre>

<h3>tab = 1 space</h3>
<pre class="t1">
	one tab text
		two tab text
</pre>

<h3>tab = 2 space</h3>
<pre class="t2">
	one tab text
		two tab text
</pre>

<h3>tab = 4 space</h3>
<pre class="t4">
	one tab text
		two tab text
</pre>

于 2019-01-21T21:11:15.713 回答
1

白色空间？你不能只使用填充吗？这是一个想法。这就是您可以在元素周围添加一些“空白区域”的方式。因此，您可以使用以下 CSS 标签：

padding: 5px;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 5px;
padding-right: 5px;
于 2018-01-11T04:10:19.417 回答
1

您可以使用此代码&#8287;在 HTML 内容中添加空格。对于制表符空间，使用 5 次或更多。

在此处查看示例：https ://www.w3schools.com/charsets/tryit.asp?deci=8287&ent=ThickSpace

于 2019-05-05T08:01:57.007 回答
0

user8657661 的答案最符合我的需求（将内容排成几行）。但是，我无法让示例代码按提供的方式工作，但我需要按如下方式进行更改：

<html>
    <head>
        <style>
            .tab9 {position:absolute;left:150px; }
        </style>
    </head>

    <body>
        Dog Food: <span class="tab9"> $30</span><br/>
        Milk of Magnesia:<span class="tab9"> $30</span><br/>
        Pizza Kit:<span class="tab9"> $5</span><br/>
        Mt Dew <span class="tab9"> $1.75</span><br/>
    </body>
</html>

如果您需要右对齐的数字，您可以更改left:150px为right:150px，但您需要根据屏幕宽度更改数字（如写的数字将是距屏幕右边缘 150 像素）。

于 2017-12-16T22:00:36.110 回答
0

这对我有用：

在我的 CSS 中，我有：

tab0  { position:absolute;left:25px;  }
tab1  { position:absolute;left:50px;  }
tab2  { position:absolute;left:75px;  }
tab3  { position:absolute;left:100px; }
tab4  { position:absolute;left:125px; }
tab5  { position:absolute;left:150px; }
tab6  { position:absolute;left:175px; }
tab7  { position:absolute;left:200px; }
tab8  { position:absolute;left:225px; }
tab9  { position:absolute;left:250px; }
tab10 { position:absolute;left:275px; }

然后在 HTML 中我只使用我的标签：

Dog Food <tab3> :$30
Milk <tab3> :$3
Pizza Kit <tab3> :$5
Mt Dew <tab3> :$1.75
于 2017-10-31T12:42:17.337 回答
-2

这是一个“Tab”文本（复制和粘贴）：“”

由于本网站的回答限制，它可能看起来不同或不是完整的标签。

于 2019-05-15T13:14:47.810 回答