From db2de36f9dee09dae90cffdf04b5ee125ba04ddf Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Tue, 8 Oct 2024 09:23:15 +0900 Subject: [PATCH] =?UTF-8?q?2024/09/20=20=E6=99=82=E7=82=B9=E3=81=AE?= =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=9F=BA=E3=81=A5=E3=81=8D?= =?UTF-8?q?=E6=9B=B4=E6=96=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../web/html/global_attributes/dir/index.md | 33 +++++++++++++------ 1 file changed, 23 insertions(+), 10 deletions(-) diff --git a/files/ja/web/html/global_attributes/dir/index.md b/files/ja/web/html/global_attributes/dir/index.md index 5554047561f934..a4884c7100dbc2 100644 --- a/files/ja/web/html/global_attributes/dir/index.md +++ b/files/ja/web/html/global_attributes/dir/index.md @@ -2,7 +2,7 @@ title: dir slug: Web/HTML/Global_attributes/dir l10n: - sourceCommit: ba96f2f183353872db6d9242c7d2dffe2dbc0c35 + sourceCommit: 83209b7db36cdeb7bab3d3ca564be3678f981778 --- {{HTMLSidebar("Global_attributes")}} @@ -17,16 +17,29 @@ l10n: - `rtl`: _right to left_ を表し、右書きの言語（アラビア語など）に対して使用します。 - `auto`: ユーザーエージェントに決定させます。書字方向が明確な文字が見つかるまで要素内の文字を解釈して、その方向を要素全体に適用する基本的なアルゴリズムを使用します。 -> [!NOTE] -> この属性は、意味論的な位置づけが異なる場所を示す {{HTMLElement("bdo")}} 要素で必須です。 -> -> - この属性は {{HTMLElement("bdi")}} 要素に継承され**ません**。属性を設定しない場合の値は `auto` になります。 -> - この属性は、 CSS の {{cssxref("direction")}} プロパティや {{cssxref("unicode-bidi")}} プロパティで上書きできます。ただし、 CSS が有効かつ要素がこれらのプロパティに対応する場合に限ります。 -> - テキストの書字方向はその表示ではなく、内容に対して意味論的な関係がありますので、ウェブ開発者には、可能であれば関連する CSS プロパティの代わりにこの属性を使用することを推奨します。これにより、 CSS に対応しないブラウザーや CSS を無効化したブラウザーでもテキストが正しく表示されます。 -> - 値 `auto` は、ユーザーが入力して最終的にデータベースへ保存するデータなど、書字方向が不定のデータに対して使用してください。 +> **メモ:** `auto` の値は、ユーザー入力や外部データなど、書字方向が不明なデータに使用すべきです。 -> [!NOTE] -> ブラウザーではユーザーが {{ HTMLElement("input") }} や {{ HTMLElement("textarea") }} の書字方向を変更することを許可して、コンテンツの執筆を支援していることがあります。 Chrome と Safari は入力フィールドのコンテキストメニューに書字方向のオプションを提供している一方、 Internet Explorer と Edge はキーバインド Ctrl + Left Shift および Ctrl + Right Shift を使用します。 Firefox は Ctrl/Cmd + Shift + X を使用しますが、 **`dir`** 属性の値は変更しません。 +指定されていない場合、値は親要素から[継承](#継承)されます。 + +この属性は、 CSS の {{ cssxref("direction") }} プロパティや {{ cssxref("unicode-bidi") }} プロパティで上書きできます。ただし、 CSS が有効かつ要素がこれらのプロパティに対応する場合に限ります。 + +テキストの書字方向はその表示ではなく、内容に対して意味論的な関係がありますので、ウェブ開発者には、可能であれば関連する CSS プロパティよりもこの属性を使用することを推奨します。これにより、CSS に対応しないブラウザーや CSS を無効化したブラウザーでもテキストが正しく表示されます。 + +## 継承 + +要素に `dir` 属性が指定されていない場合、その[親ノード](/ja/docs/Glossary/Node/DOM)に設定された `dir` の値を継承します。さらにその親ノードから継承している場合もあります。 + +## 使用上の注意 + +画像の `dir` プロパティを `"rtl"` に設定すると、HTML の `title` および `alt` 属性が `"rtl"` として整形および定義されます。 + +表の `dir` が `"rtl"` に設定されている場合、列の順序は右から左に並べられます。 + +この属性は、意味論的な位置づけが異なる場所を示す {{ HTMLElement("bdo") }} 要素で必須です。 + +この属性は、{{ HTMLElement("bdi") }} 要素には継承されません。設定されていない場合、その値は `auto` です。 + +ブラウザーではユーザーが {{ HTMLElement("input") }} や {{ HTMLElement("textarea") }} の書字方向を変更することを許可して、コンテンツの執筆を支援していることがあります。Chrome と Safari は入力フィールドのコンテキストメニューに書字方向のオプションを提供しています。Firefox は Ctrl/Cmd + Shift + X を使用しますが、`dir` 属性の値は変更しません。 ## 仕様書