Css 简明教程

CSS - tab-size Property

CSS tab-size 属性用于指定元素中制表符字符U+0009的宽度。它允许你控制制表符字符的可视间距，当显示代码或其他制表符字符很重要的内容时，这很有用。

Possible Values

  1. <integer> −指定制表符字符的宽度，为单个空格字符宽度的倍数。例如，值4将使制表符字符比空格字符宽四倍。它不能为负数。

  2. <length> −使用固定长度值指定制表符字符的宽度，如像素（px）、磅（pt）或em（em）。它不能为负数。

Applies to

块容器。

Syntax

<integer> Values

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

<length> Values

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

CSS tab-size - Expanding By Character Count

以下示例演示 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 - Comparing To The Default Size

以下示例演示默认制表符大小、3个字符的制表符大小和3个空格的制表符大小。 white-space: 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>