Skip to content

Commit

Permalink
2024/09/20 時点の英語版に基づき更新
Browse files Browse the repository at this point in the history
  • Loading branch information
mfuji09 committed Oct 12, 2024
1 parent 6ca5f15 commit db2de36
Showing 1 changed file with 23 additions and 10 deletions.
33 changes: 23 additions & 10 deletions files/ja/web/html/global_attributes/dir/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: dir
slug: Web/HTML/Global_attributes/dir
l10n:
sourceCommit: ba96f2f183353872db6d9242c7d2dffe2dbc0c35
sourceCommit: 83209b7db36cdeb7bab3d3ca564be3678f981778
---

{{HTMLSidebar("Global_attributes")}}
Expand All @@ -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 はキーバインド <kbd>Ctrl</kbd> + <kbd>Left Shift</kbd> および <kbd>Ctrl</kbd> + <kbd>Right Shift</kbd> を使用します。 Firefox は <kbd>Ctrl</kbd>/<kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>X</kbd> を使用しますが、 **`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 は <kbd>Ctrl</kbd>/<kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>X</kbd> を使用しますが、`dir` 属性の値は変更しません。

## 仕様書

Expand Down

0 comments on commit db2de36

Please sign in to comment.