From 4ace0769da3bc823dd8a3d86211cefa850ce3007 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Tue, 5 Oct 2021 01:44:43 +0900 Subject: CSS Text モジュールの文書を更新 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 2021/08/13 時点の英語版に同期 - Web/CSS/CSS_Text/Wrapping_Text を新規翻訳 --- files/ja/web/css/tab-size/index.md | 114 ++++++++++++++++++++----------------- 1 file changed, 63 insertions(+), 51 deletions(-) (limited to 'files/ja/web/css/tab-size') diff --git a/files/ja/web/css/tab-size/index.md b/files/ja/web/css/tab-size/index.md index ca89ae5ed3..31c387cac8 100644 --- a/files/ja/web/css/tab-size/index.md +++ b/files/ja/web/css/tab-size/index.md @@ -3,94 +3,106 @@ title: tab-size slug: Web/CSS/tab-size tags: - CSS - - CSS Property - - CSS テキスト - CSS プロパティ - - Experimental + - CSS テキスト - Reference + - recipe:css-property +browser-compat: css.properties.tab-size translation_of: Web/CSS/tab-size --- -
{{CSSRef}}{{SeeCompatTable}}
+{{CSSRef}} + +CSS の **`tab-size`** プロパティは、タブ文字 (U+0009) の表示幅の指定に用います。 -

CSS の tab-size プロパティは、タブ文字 (U+0009) の表示幅の指定に用います。

+## 構文 -
/* <integer> 値 */
+```css
+/*  値 */
 tab-size: 4;
 tab-size: 0;
 
-/* <length> 値 */
+/*  値 */
 tab-size: 10px;
 tab-size: 2em;
 
 /* グローバル値 */
 tab-size: inherit;
 tab-size: initial;
+tab-size: revert;
 tab-size: unset;
-
+``` -

{{CSSInfo}}

+### 値 -

構文

+- {{CSSxRef("<integer>")}} + - : タブの幅として使用される空白文字（U+0020）の幅の倍数です。正の数でなければなりません。 +- {{CSSxRef("<length>")}} + - : タブの幅です。正の数でなければなりません。 -

値

+## 公式定義 -
-
{{CSSxRef("<integer>")}}
-
タブの空白文字の文字数です。正の数でなければなりません。
-
{{CSSxRef("<length>")}}
-
タブの幅です。正の数でなければなりません。
-
+{{CSSInfo}} -

形式文法

+## 形式文法 -{{csssyntax}} +{{CSSSyntax}} -

例

+## 例 -
pre {
+### 文字数による展開
+
+```css
+pre {
   tab-size: 4; /* スペース 4 つ分となります */
 }
-
+``` + +### タブの折り畳み -
pre {
+```css
+pre {
   tab-size: 0; /* インデント除去 */
 }
-
+``` + +

既定の大きさの比較

-
pre {
-  tab-size: 2; /* タブの幅をスペース 2 個分に設定 */
+この例では、既定のタブの大きさとカスタムのタブの大きさを比較しています。タブがつぶれないように、 {{cssxref("white-space")}} を `pre` に設定していることに注意してください。
+
+#### HTML
+
+```html
+
no tab

+
	default tab size of 8 characters wide

+
	custom tab size of 3 characters wide

+
   3 spaces, equivalent to the custom tab size

+```
+
+#### CSS
+
+```css
+p {
+  white-space: pre;
 }
-
-

仕様書

+.custom { + tab-size: 3; + -moz-tab-size: 3; +} +``` - - - - - - - - - - - - - - - -
仕様書状態備考
{{SpecName('CSS3 Text', '#tab-size-property', 'tab-size')}}{{Spec2('CSS3 Text')}}初回定義
+#### 結果 -

ブラウザーの対応

+{{EmbedLiveSample('Comparing_to_the_default_size')}} +## 仕様書 +{{Specifications}} -

{{Compat("css.properties.tab-size")}}

+## ブラウザーの互換性 -

+{{Compat}} -

関連情報

+## 関連情報 - +- [Controlling size of a tab character (U+0009)](https://lists.w3.org/Archives/Public/www-style/2008Dec/0009.html) - Anne van Kesteren 氏 (Opera) からの CSSWG へのメール -- cgit v1.2.3-54-g00ecf