飞鱼博客

很多人在用文本文件编辑器或Word编辑文章，喜欢用TAB键来对齐一起内容，但是这个TAB在网页编辑时有时不太好用，因为浏览会自动将TAB制表符变成一个小空格，于是原来的内容就没法对齐了。

查找资料，发现原来有一个我不太熟悉的Html标签能够解决这个问题。

<pre></pre> 标签，可以定义预格式化的文本。被包围在<pre></pre> 标签中的文本通常会保留空格、换行符、制表符等内容，而且文本也会呈现为等宽字体。特别适合用来表示计算机的源代码。

举例：

我原来只能在网页中像下面这样手动加空格来对齐：

项目1            项目2             项目3
aaa               bbb               ccc
 iii                  jjj                 abc
xxx               yyy                 xyz

现在使用了<pre></pre> 标签包围了含有TAB制表符的内容，效果就好多了。

项目1		项目2		项目3
aaa		bbb		ccc
iii		jjj		abc
xxx		yyy		xyz

效果中的灰色底框是对<pre></pre> 标签应用了CSS样式的结果。

操作方法：
在文本文件编辑器中直接编辑好含有TAB制表符的文本，然后在文本最上面加<pre>标签，最下面加</pre> 标签，然后在复制粘贴回网页的Html编辑器。

在Html编辑器其实还是不能直接看到TAB制表符，如果想直接编辑Html，可以在<pre></pre> 标签包围的内容中插入"&#9;"来表是TAB制表符。