首页 > 1 软件使用心得 > Html网页中实现TAB制表符功能

Html网页中实现TAB制表符功能

2011年6月16日 AEROFISH 2,182 views 发表评论 阅读评论

很多人在用文本文件编辑器或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制表符。


本文对我无帮助,减1分本文对我有帮助,加1分 (本文对您有帮助吗?)
Loading ... Loading ...

  1. 本文目前尚无任何评论.
  1. 本文目前尚无任何 trackbacks 和 pingbacks.