tab-size CSS3

tab-size は、タブの幅の指定に使います。詳細 保持（空白処理で除去・潰れなかった空白）された タブ文字（U+0009）のレンダリングに使用されるタブサイズを指定します。 <number>は、空白文字（U+0020）の送り幅（advance width）の倍数として数値を表します。 関連付けられた letter-spacing 及び word-spacing を含みます。負の値は許可されません。 （詳細 空白文字一覧）

名前:tab-size
値: <number> | <length>
初期値:8
適用対象:ブロックコンテナ
継承:する
パーセンテージ:n/a
メディア:visual（視覚的）
計算値:指定された整数、または絶対化した長さ
正規順序:n/a
アニメーション:長さ、数、calc式

Value（値）

<number>
初期値は 8 空白文字（U+0020）の個数を指定
<length>
数値＋単位で指定

HTML source

<!DOCTYPE html>
<html>
 <head>
  <title></title>
  <style>
   p.test1 { tab-size: 0; -moz-tab-size: 0; white-space: pre; }
   p.test2 { tab-size: 10; -moz-tab-size: 10; white-space: pre; }
   p.test3 { tab-size: 10; -moz-tab-size: 10; white-space: pre-wrap; }
   p.test4 { tab-size: 100px; -moz-tab-size: 100px; white-space: pre; }
   pre.test5 { tab-size: 100px; -moz-tab-size: 100px; }
  </style>
 </head>
 <body>
   <p class="test1">	tab-size:0;white-space:pre;</p>
   <p class="test2">	tab-size:10;white-space: pre;</p>
   <p class="test3">	tab-size:10;white-space:pre-wrap;</p>
   <p class="test4">	tab-size:100px;white-space:pre;</p>
   <p><pre class="test5">	tab-size:100px;</pre></p>
 </body>
</html>

display

tab-size:0;white-space:pre;

tab-size:10;white-space: pre;

tab-size:10;white-space:pre-wrap;

tab-size:100px;white-space:pre;

	tab-size:100px;

上に戻る