Merge branch 'main' into fix-design-responsivo

files/ja/web/api/htmlelement/accesskey/index.md

@@ -1,8 +1,9 @@
 ---
 title: "HTMLElement: accessKey プロパティ"
+short-title: accessKey
 slug: Web/API/HTMLElement/accessKey
 l10n:
-  sourceCommit: a3d9f61a8990ba7b53bda9748d1f26a9e9810b18
+  sourceCommit: e9e2ec643ac69c132f31427a0b586ab2cf83ed58
 ---
 
 {{APIRef("DOM")}}
@@ -11,6 +12,10 @@ l10n:
 
 > **メモ:** `HTMLElement.accessKey` プロパティは、ブラウザーにすでに存在するキーバインドとよく衝突するため、めったに使われることはありません。これを回避するために、ブラウザーは accesskey の動作を他の「修飾」キー（<kbd>Alt</kbd> + accesskey など）と一緒に押された場合に動作するよう実装しています。
 
+## 仕様書
+
+{{Specifications}}
+
 ## ブラウザーの互換性
 
 {{Compat}}

files/ja/web/api/htmlelement/accesskeylabel/index.md

@@ -1,5 +1,6 @@
 ---
 title: "HTMLElement: accessKeyLabel プロパティ"
+short-title: accessKeyLabel
 slug: Web/API/HTMLElement/accessKeyLabel
 l10n:
   sourceCommit: a3d9f61a8990ba7b53bda9748d1f26a9e9810b18

files/ja/web/api/htmlelement/anchorelement/index.md

@@ -0,0 +1,75 @@
+---
+title: "HTMLElement: anchorElement プロパティ"
+short-title: anchorElement
+slug: Web/API/HTMLElement/anchorElement
+l10n:
+  sourceCommit: bba05bf24a714715f3517cf1296274dd41d6e811
+---
+
+{{APIRef("HTML DOM")}}{{Non-standard_Header}}{{SeeCompatTable}}
+
+**`anchorElement`** は {{domxref("HTMLElement")}} インターフェイスのプロパティで、この要素のアンカー要素への参照を返します。これは、HTML の [`anchor`](/ja/docs/Web/HTML/Global_attributes/anchor) 属性でアンカーに関連付けられた要素の場合にのみ動作し、CSS の {{cssxref("anchor-name")}} および {{cssxref("position-anchor")}} プロパティでアンカーに関連付けられた要素では動作しません。
+
+アンカーの機能と使用法の詳細情報については、[CSS アンカー位置指定](/ja/docs/Web/CSS/CSS_anchor_positioning)モジュールのランディングページと [CSS アンカー位置指定の使用](/ja/docs/Web/CSS/CSS_anchor_positioning/Using)のガイドを参照してください。
+
+## 値
+
+要素のアンカー要素を表す {{domxref("HTMLElement")}} インスタンス、またはアンカー要素を保有していない場合は `null` です。
+
+## 例
+
+### 基本的な使い方
+
+この例はHTMLで要素とアンカーを関連付け、JavaScript を使用してアンカー要素への参照を取得します。
+
+#### HTML
+
+HTML では、{{htmlelement("div")}} を作成し、[`id`](/ja/docs/Web/HTML/Global_attributes/id) を `example-anchor` にします。これがアンカー要素となります。次に、もう一つの `<div>` を作成し、クラスを `infobox` に、[`anchor`](/ja/docs/Web/HTML/Global_attributes/anchor) 属性を `example-anchor` に設定します。これにより、最初の `<div>` が 2 つ目の `<div>` のアンカーとして指定され、2 つが関連付けられます。
+
+また、結果を出力するために {{htmlelement("p")}} 要素を記載します。
+
+```html
+<div class="anchor" id="example-anchor">⚓︎</div>
+
+<div class="infobox" anchor="example-anchor">
+  <p>これは情報ボックスです。</p>
+</div>
+
+<p class="output"></p>
+```
+
+#### JavaScript
+
+JavaScript を使用して位置指定要素と出力要素の参照を取得し、位置指定要素の `anchorElement` プロパティに関連付けられた `id` の値を output に表示させ、アンカー要素が位置指定要素の `anchorElement` であることを示します。
+
+```js
+const posElem = document.querySelector(".infobox");
+const outputElem = document.querySelector(".output");
+
+try {
+  outputElem.textContent = `位置指定要素のアンカー要素は ${posElem.anchorElement.id} です。`;
+} catch (e) {
+  outputElem.textContent = `このブラウザーは anchorElement プロパティに対応していません。`;
+}
+```
+
+#### 結果
+
+結果は次のようになります。
+
+{{EmbedLiveSample("Basic usage", "100%", 110)}}
+
+## 仕様書
+
+この属性は現在 HTML の仕様書には属していません。`anchorElement` プロパティの追加に関する議論は [https://github.com/whatwg/html/pull/9144](https://github.com/whatwg/html/pull/9144) を参照してください。
+
+## ブラウザーの互換性
+
+{{Compat}}
+
+## 関連情報
+
+- HTML [`anchor`](/ja/docs/Web/HTML/Global_attributes/anchor) 属性
+- CSS {{cssxref("anchor-name")}} および {{cssxref("position-anchor")}} プロパティ
+- [CSS アンカー位置指定](/ja/docs/Web/CSS/CSS_anchor_positioning)モジュール
+- [CSS アンカー位置指定の使用](/ja/docs/Web/CSS/CSS_anchor_positioning/Using)のガイド

files/ja/web/api/htmlelement/attributestylemap/index.md

@@ -0,0 +1,63 @@
+---
+title: "HTMLElement: attributeStyleMap プロパティ"
+short-title: attributeStyleMap
+slug: Web/API/HTMLElement/attributeStyleMap
+l10n:
+  sourceCommit: bba05bf24a714715f3517cf1296274dd41d6e811
+---
+
+{{APIRef("CSSOM")}}
+
+**`attributeStyleMap`** は {{domxref("HTMLElement")}} インターフェイスの読み取り専用のプロパティで、生きた {{domxref("StylePropertyMap")}} を返します。これには、要素のインライン スタイル属性で定義されているか、スクリプト経由で {{domxref("HTMLElement")}} インターフェイスの {{domxref("HTMLElement.style", "style")}} プロパティを使用して割り当てられた、要素のスタイルプロパティのリストが入ります。
+
+一括指定プロパティは展開されます。`border-top: 1px solid black` を設定すると、代わりに個別指定プロパティ ({{cssxref("border-top-color")}}, {{cssxref("border-top-style")}}, {{cssxref("border-top-width")}}) が設定されます。
+
+{{domxref("HTMLElement.style", "style")}} プロパティと `attributeStyleMap` プロパティの主な違いは、`style` プロパティが {{domxref("CSSStyleDeclaration")}} オブジェクトを返すのに対し、`attributeStyleMap` プロパティは {{domxref("StylePropertyMap")}} オブジェクトを返すことです。
+
+このプロパティ自身は書き込みできませんが、`style` プロパティを通じて返す {{domxref("CSSStyleDeclaration")}} オブジェクトと同様に、このプロパティが返す {{domxref("StylePropertyMap")}} オブジェクトを通じてインラインスタイルを読み書きすることができます。
+
+## 値
+
+生きた {{domxref("StylePropertyMap")}} オブジェクトです。
+
+## 例
+
+次のコードは `style` 属性と `attributeStyleMap` プロパティの関係を示しています。
+
+```html
+<div style="white-space: pre-line;">
+  <div id="el" style="border-top: 1px solid blue; color: red;">要素の例</div>
+  <div id="output"></div>
+</div>
+```
+
+```css
+#el {
+  font-size: 16px;
+}
+```
+
+```js
+const element = document.getElementById("el");
+const output = document.getElementById("output");
+
+for (const property of element.attributeStyleMap) {
+  output.textContent += `${property[0]} = ${property[1][0].toString()}\n`;
+}
+```
+
+{{EmbedLiveSample("Examples", "200", "200")}}
+
+## 仕様書
+
+{{Specifications}}
+
+## ブラウザーの互換性
+
+{{Compat}}
+
+## 関連情報
+
+- {{domxref("HTMLElement.style")}}
+- {{domxref("SVGElement.attributeStyleMap")}}
+- {{domxref("MathMLElement.attributeStyleMap")}}