一般情况下,在网页中输入文字的时候,往往用到空格分隔文本或者一个段落的开始空两格,如果在段落开始增加了多个半角空格,在浏览器中浏览时往往只能看到一个空格的效果,然而看不到多个空格的效果。这主要是在 HTML 文件中,一般需要使用全角空格符号,或者通过空格代码来取代。那在 HTML 文件中,html空格怎么打出来以及怎么实现多个空格呢?

拓展:全角指一个字符占用两个标准字符位置。半角指一字符占用一个标准的字符位置。在编写程序时,代码中(包括HTML)只能使用半角标点(除字符串内的数据)。

HTML 空格符号语法

 

注意: 是 HTML 空格转义字符。书写时应注意,前缀“&”+中间字符“nbsp”+后缀“;”,特别是后缀分号不要忘记输入

HTML   空格标签定义

&nbsp; 可定义一个半角空格。也就是说,在<u>...</u>元素中的文本浏览器会把其加上下划线呈现给用户浏览。

<!-- 一个 HTML 空格 -->
&nbsp;
<!-- 两个 HTML 空格 -->
&nbsp;&nbsp;
<!-- 多个 HTML 空格代码 复制多个&nbsp; -->
&nbsp;&nbsp;...&nbsp;

提示:在网页中可以输入多个空格,一个&nbsp;只能代表一个半角空格,依此类推,多个&nbsp;就代表多个空格。那么如果我们在网页中需要多个空格,那就可以复制多个&nbsp;空格代码粘贴到相应位置。

HTML &nbsp; 空格实例演示

<html>
<head>
<title>HTML &nbsp; 空格</title>
</head>
<body>
在段落开始加空格的效果:<br/>
&nbsp;&nbsp;&nbsp;&nbsp;空格在网页的排版中经常会被应用到,使用空格符号在段落的开始输入几个空格,就可以实现首行缩进的效果。<br/>
在文字的中间输入多个空格符号的效果:<br/>
w3教程的网址是:&nbsp;&nbsp;&nbsp;&nbsp;http://www.w3run.com<br/>
在文字的中间直接输入多个半角空格的效果:<br/>
w3教程的网址是:    http://www.w3run.com
</body>
</html>

运行效果如下图所示:

HTML空格演示

注意:从上面的实例中我们可以清楚的扛到不管在两语句间输入多个个半角空格,只能显示一个空格的效果,其余的空格符号则被浏览器忽略掉。而输入多个 HTML 空格代码则可以完整的保留显示空格的效果。所以,初学者特别注意这一点,不要一个劲的在 HTML 代码中添加空格符,最后不能达到预期的效果。