2021/08/13 時点の英語版に同期

1 files changed, 48 insertions, 50 deletions

diff --git a/files/ja/web/css/column-rule/index.md b/files/ja/web/css/column-rule/index.md
index 768c36a8d8..f8d2ec4b89 100644
--- a/files/ja/web/css/column-rule/index.md
+++ b/files/ja/web/css/column-rule/index.md
@@ -3,28 +3,27 @@ title: column-rule
 slug: Web/CSS/column-rule
 tags:
   - CSS
-  - CSS Multi-column Layout
-  - CSS Property
-  - Reference
-  - 'recipe:css-property'
+  - CSS 段組みレイアウト
+  - CSS プロパティ
+  - リファレンス
+  - recipe:css-property
 browser-compat: css.properties.column-rule
 translation_of: Web/CSS/column-rule
 ---
-<div>{{CSSRef}}</div>
+{{CSSRef}}
 
-<p><strong><code>column-rule</code></strong> は<a href="/ja/docs/Web/CSS/Shorthand_properties">一括指定</a>を行う <a href="/ja/docs/Web/CSS">CSS</a> のプロパティで、段組みレイアウトで段間に引かれる線の太さ、スタイル、色を設定します。</p>
+**`column-rule`** は[一括指定](/ja/docs/Web/CSS/Shorthand_properties)を行う [CSS](/ja/docs/Web/CSS) のプロパティで、段組みレイアウトで段間に引かれる線（段間罫）の太さ、スタイル、色を設定します。
 
-<div>{{EmbedInteractiveExample("pages/css/column-rule.html")}}</div>
+{{EmbedInteractiveExample("pages/css/column-rule.html")}}
 
-<p>これは<a href="/ja/docs/Web/CSS/Shorthand_properties">一括指定プロパティ</a>であり、一回の便利な宣言で個別の <code>column-rule-*</code> プロパティ ({{Cssxref("column-rule-width")}}, {{Cssxref("column-rule-style")}}, {{Cssxref("column-rule-color")}}) を設定できます。</p>
+これは[一括指定プロパティ](/ja/docs/Web/CSS/Shorthand_properties)であり、一回の便利な宣言で個別の `column-rule-*` プロパティ ({{Cssxref("column-rule-width")}}, {{Cssxref("column-rule-style")}}, {{Cssxref("column-rule-color")}}) を設定できます。
 
-<div class="note">
-<p><strong>メモ:</strong> 他の一括指定プロパティと同様に、指定されなかった個別の値は初期値が設定されます (以前に個別指定プロパティを使用して設定された値を上書きする可能性があります)。</p>
-</div>
+> **Note:** 他の一括指定プロパティと同様に、指定されなかった個別の値は初期値が設定されます (以前に個別指定プロパティを使用して設定された値を上書きする可能性があります)。
 
-<h2 id="Syntax">構文</h2>
+## 構文
 
-<pre class="brush:css no-line-numbers">column-rule: dotted;
+```css
+column-rule: dotted;
 column-rule: solid 8px;
 column-rule: solid blue;
 column-rule: thick inset blue;
@@ -34,34 +33,33 @@ column-rule: inherit;
 column-rule: initial;
 column-rule: revert;
 column-rule: unset;
-</pre>
+```
 
-<p><code>column-rule</code> プロパティは、以下に挙げる値のうち 1 ～ 3 個を任意の順序で指定します。</p>
+`column-rule` プロパティは、以下に挙げる値のうち 1 ～ 3 個を任意の順序で指定します。
 
 <h3 id="Values">値</h3>
 
-<dl>
- <dt><code>&lt;'column-rule-width'&gt;</code></dt>
- <dd>{{cssxref("&lt;length&gt;")}} または 3 つのキーワード、 <code>thin</code>、<code>medium</code>、<code>thick</code> のうちの 1 つです。詳しくは {{cssxref("border-width")}} を参照してください。</dd>
- <dt><code>&lt;'column-rule-style'&gt;</code></dt>
- <dd>有効な値と詳細は {{cssxref("border-style")}} を参照してください。</dd>
- <dt><code>&lt;'column-rule-color'&gt;</code></dt>
- <dd>{{cssxref("&lt;color&gt;")}} 値です。</dd>
-</dl>
+- `<'column-rule-width'>`
+  - : {{cssxref("&lt;length&gt;")}} または 3 つのキーワード、 `thin`、`medium`、`thick` のうちの 1 つです。詳しくは {{cssxref("border-width")}} を参照してください。
+- `<'column-rule-style'>`
+  - : 有効な値と詳細は {{cssxref("border-style")}} を参照してください。
+- `<'column-rule-color'>`
+  - : {{cssxref("&lt;color&gt;")}} 値です。
 
-<h2 id="Formal_definition">公式定義</h2>
+## 公式定義
 
-<p>{{cssinfo}}</p>
+{{cssinfo}}
 
-<h2 id="Formal_syntax">形式文法</h2>
+## 形式文法
 
 {{csssyntax}}
 
-<h2 id="Examples">例</h2>
+## 例
 
-<h3 id="Example_1">例 1</h3>
+### 例 1
 
-<pre class="brush: css">/* "medium dotted currentcolor" と同じ */
+```css
+/* "medium dotted currentcolor" と同じ */
 p.foo { column-rule: dotted; }
 
 /* "medium solid blue" と同じ */
@@ -71,47 +69,47 @@ p.bar { column-rule: solid blue; }
 p.baz { column-rule: solid 8px; }
 
 p.abc { column-rule: thick inset blue; }
-</pre>
+```
 
-<h3 id="Example_2">例 2</h3>
+### 例 2
 
-<h4 id="HTML">HTML</h4>
+#### HTML
 
-<pre class="brush: html">&lt;p class="content-box"&gt;
+```html
+<p class="content-box">
   This is a bunch of text split into three columns.
   Take note of how the `column-rule` property is used
   to adjust the style, width, and color of the rule
   that appears between the columns.
-&lt;/p&gt;
-</pre>
+</p>
+```
 
-<h4 id="CSS">CSS</h4>
+#### CSS
 
-<pre class="brush: css">.content-box {
+```css
+.content-box {
   padding: 0.3em;
   background: #ff7;
   column-count: 3;
   column-rule: inset 2px #33f;
 }
-</pre>
+```
 
-<h4 id="Result">結果</h4>
+#### 結果
 
-<p>{{EmbedLiveSample('Example_2')}}</p>
+{{EmbedLiveSample('Example_2')}}
 
-<h2 id="Specifications">仕様書</h2>
+## 仕様書
 
 {{Specifications}}
 
-<h2 id="Browser_compatibility">ブラウザーの互換性</h2>
+## ブラウザーの互換性
 
-<p>{{Compat}}</p>
+{{Compat}}
 
-<h2 id="See_also">関連情報</h2>
+## 関連情報
 
-<ul>
- <li><a href="/ja/docs/Learn/CSS/CSS_layout/Multiple-column_Layout">段組みレイアウト</a></li>
- <li>{{CSSXref("column-rule-style")}}</li>
- <li>{{CSSXref("column-rule-width")}}</li>
- <li>{{CSSXref("column-rule-color")}}</li>
-</ul>
+- [段組みレイアウト](/ja/docs/Learn/CSS/CSS_layout/Multiple-column_Layout)
+- {{CSSXref("column-rule-style")}}
+- {{CSSXref("column-rule-width")}}
+- {{CSSXref("column-rule-color")}}