diff options
Diffstat (limited to 'files/zh-cn/web/css/tab-size/index.html')
| -rw-r--r-- | files/zh-cn/web/css/tab-size/index.html | 117 |
1 files changed, 117 insertions, 0 deletions
diff --git a/files/zh-cn/web/css/tab-size/index.html b/files/zh-cn/web/css/tab-size/index.html new file mode 100644 index 0000000000..ee314a6438 --- /dev/null +++ b/files/zh-cn/web/css/tab-size/index.html @@ -0,0 +1,117 @@ +--- +title: tab-size +slug: Web/CSS/tab-size +tags: + - CSS + - 参考 +translation_of: Web/CSS/tab-size +--- +<div>{{CSSRef}}{{SeeCompatTable}}</div> + +<p>CSS 属性<strong> <code>tab-size</code></strong> 用于自定义制表符 (<code>U+0009</code>) 的宽度。</p> + +<pre class="brush:css no-line-numbers">/* <integer> values */ +tab-size: 4; +tab-size: 0; + +/* <length> values */ +tab-size: 10px; +tab-size: 2em; + +/* Global values */ +tab-size: inherit; +tab-size: initial; +tab-size: unset; +</pre> + +<p>{{CSSInfo}}</p> + +<h2 id="语法">语法</h2> + +<h3 id="值">值</h3> + +<dl> + <dt>{{CSSxRef("<integer>")}}</dt> + <dd>制表符对应的空格数。必须为非负值。</dd> + <dt>{{CSSxRef("<length>")}}</dt> + <dd>制表符的宽度。必须为非负值。</dd> +</dl> + +<h3 id="正式语法">正式语法</h3> + +<pre class="syntaxbox">{{CSSSyntax}}</pre> + +<h2 id="示例">示例</h2> + +<pre class="brush: css">pre { + tab-size: 4; /* 将制表符宽度设为 4 个空格 */ +} +</pre> + +<pre class="brush: css">pre { + tab-size: 0; /* 移除缩进效果 */ +} +</pre> + +<pre class="brush: css">pre { + tab-size: 2; /* 将制表符宽度设为 2 个空格 */ +} +</pre> + +<h3 id="在线演示">在线演示</h3> + +<p>本示例比较了默认制表符宽度和自定义制表符宽度。注意 {{cssxref("white-space")}} 被设置为 <code>pre</code> 以防止制表符收起。</p> + +<h4 id="HTML">HTML</h4> + +<pre class="brush: html"><p>no tab</p> +<p>&#0009;default tab size of 8 spaces</p> +<p class="custom">&#0009;custom tab size of 3 spaces</p> +<p>&nbsp;&nbsp;&nbsp;3 spaces, equivalent to the custom tab size</p> +</pre> + +<h4 id="CSS">CSS</h4> + +<pre class="brush: css">p { + white-space: pre; +} + +.custom { + -moz-tab-size: 3; + tab-size: 3; +}</pre> + +<h4 id="结果">结果</h4> + +<p>{{EmbedLiveSample('Live_sample')}}</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('CSS3 Text', '#tab-size-property', 'tab-size')}}</td> + <td>{{Spec2('CSS3 Text')}}</td> + <td>Initial definition</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("css.properties.tab-size")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li><a class="external" href="https://lists.w3.org/Archives/Public/www-style/2008Dec/0009.html"><cite>Controlling size of a tab character (U+0009)</cite></a>，Anne van Kesteren 发送给 CSSWG 的一封电子邮件。</li> +</ul> |