段字间距

Question

您好我一直在使用HTML一段时间但是今天我注意到了html中的标签。我知道你在学习HTML的过程中都注意到它。

我的问题是，为什么我们不能在html <p>代码或<h1>代码中提供多个空格？

我的意思是为什么：

<p>ba ba             ba ba</p>

与此相同：

<p>ba ba ba ba</p>

两者都有这个结果：

ba ba ba ba

我知道空格在html中无关紧要，但<p> <h1>是文本的容器，所以为什么它们只给出一个空格。

我怎样才能实现这一目标？

ba ba             ba ba

Answer 1

您可以使用 而不仅仅是空格，例如：

<p>ba&nbsp;&nbsp;ba&nbsp;&nbsp;&nbsp;&nbsp;ba ba</p>

fiddle

您还可以阅读本指南：

Non-Breaking Space in HTML

Answer 2

您想要p { white-space: pre; }

Have a fiddle!

CSS

p { white-space: pre; }

HTML

<p>test test            test</p> 

---

根据具体情况，您可能需要使用<pre>。

Fiddle for pre

HTML

<pre>test test            test</pre>

More information on pre

Answer 3

有几种方法可以欺骗＆＃39;它（根本不是真的伎俩）。

<强> JSFiddle

<p>Hello there whats<span></span> your name</p>

风格：

span{
    width:50px;
    display:inline-block;
}

看起来像：

Hello there whats         your name

---

还有另一个选项，使用 

这意味着＆＃34;不打破空间＆＃34;。

<强> JSFiddle

HTML：

<p>Hello there whats&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;your name</p>

哪个产生

Hello there whats         your name

---

第三种选择是添加margin。

<强> JSFiddle

HTML：

<p>Hello there whats<span></span>your name</p>

CSS：

span{
    margin:0 50px;
}

最终结果：

Hello there whats          your name

---

我这样做的方法是使用white-space:。

<强> JSFiddle

HTML：

<p>Hello there whats                your name</p>

CSS：

p{
    white-space:pre;
}

最终结果：

Hello there whats                your name