tab-size
CSS の tab-size プロパティは、タブ文字 (U+0009) の表示幅の指定に用います。
対応ブラウザ
| 機能 | デスクトップ | モバイル | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| 21 | 79 | 91 | 7 | 25 | 7 | |
| は CSS のデータ型で、長さの値を表します。長さは width、height、margin、padding、border-width、font-size、text-shadow など数多くの CSS プロパティで使用されています。 | 42 | 79 | 53 | 13.1 | 42 | 13.4 |
注釈 1件
実装メモ
- このプロパティはまだアニメーション化できません。
注釈 1件
実装メモ
- このプロパティはまだアニメーション化できません。
注釈 2件
対応条件
- ベンダープレフィックス付きで対応: -moz- (4)
実装メモ
- Firefox 53 より前では、このプロパティはアニメーション化できませんでした。
注釈 1件
実装メモ
- このプロパティはまだアニメーション化できません。
基本構文
CSS
/* Tab width equal to 4 spaces */
pre {
tab-size: 4;
-moz-tab-size: 4; /* For Firefox 91 and earlier */
}
/* Fixed-width specification */
code {
tab-size: 2em;
}ライブデモ
実務での使いどころ
-
コードブロックの表示
技術ブログやドキュメントサイトで、コードのインデント幅をプロジェクトの規約に合わせて表示する。
注意点
- white-space が pre または pre-wrap でないとタブ文字は通常のスペースとして扱われる。
アクセシビリティ
- タブ幅が極端に大きいとコードの可読性が下がる。一般的な 2 または 4 を推奨。