CSS - tab-size 属性

CSS tab-size 属性用于指定元素内制表符（（U+0009））的宽度。它允许您控制制表符的视觉间距，这在显示制表符很重要的代码或其他内容时非常有用。

可能的值

<integer> - 将制表符的宽度指定为单个空格字符宽度的倍数。例如，值为 4 将使制表符的宽度是空格字符的四倍。它不能是负数。
<length> - 使用固定长度值指定制表符的宽度，例如像素（px）、点（pt）或 ems （em）。它不能是负数。

适用于

阻止容器。

语法

<integer> 值


tab-size: 4;
tab-size: 0;

<length>值


tab-size: 10px;
tab-size: 2em;

CSS tab-size - 按字符数扩展

以下示例演示了 tab-size 属性如何将制表符大小设置为 8 个字符，并将制表符大小设置为 12 个字符 -


<html>
<head>
<style>	
	 	.tab1 {
	 	 	 -moz-tab-size: 8;	
	 	 	 tab-size: 8;
	 	}
	 	.tab2 {
	 	 	 -moz-tab-size: 12;	
	 	 	 tab-size: 12;
	 	}
</style>
</head>
<body>

<pre class="tab1">
CSS		 	 tab-size with 	 	8.
</pre>

<pre class="tab2">
CSS		 	 tab-size 	 	 	 	with 12.
</pre>

</body>
</html>

CSS tab-size - 与默认大小比较

以下示例演示了默认制表符大小、3 个字符的制表符大小和 3 个空格的制表符大小。空格：pre 可防止标签折叠。−


<html>
<head>
<style>	
	 	p {
	 	 	 white-space: pre;
	 	}
	 	.tab1 {
	 	 	 tab-size: 3;
	 	}
</style>
</head>
<body>
	 	<p>Without tab-size</p>
	 	<p>		 	Default tab-size to 8 characters.</p>
	 	<p class="tab1">		 	tab-size with 3 characters.</p>
	 	<p> 	 tab-size with 3 spaces.</p>
</body>
</html>

打印本页