From e690a74b952522e9a833897b23b6f5fe7ac4ac37 Mon Sep 17 00:00:00 2001
From: Masahiro FUJIMOTO このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 https://github.com/mdn/interactive-examples をクローンしてプルリクエストを送信してください。 This is a bunch of text split into three columns.
The `column-rule-width` property is used to change
the width of the line that is drawn between columns.
- Don't you think that's wonderful?</p>column-rule-width は CSS のプロパティで、段組みレイアウトで段間に引かれる線の太さを設定します。構文
-
-/* キーワード値 */
+```css
+/* キーワード値 */
column-rule-width: thin;
column-rule-width: medium;
column-rule-width: thick;
-/* <length> 値 */
+/*
+```
+
+`column-rule-width` プロパティは単一の `<'border-width'>` の値で指定します。
-column-rule-width プロパティは単一の <'border-width'> の値で指定します。値
+- `<'border-width'>`
+ - : {{ cssxref("border-width") }} で定められたキーワードで段間罫の太さを指定します。 {{cssxref("<length>")}} または `thin`、 `medium`、 `thick` のキーワードのいずれかです。
-
-
+## 公式定義
-<'border-width'>thin、 medium、 thick のキーワードのいずれかです。形式文法
+{{cssinfo}}
+
+## 形式文法
{{csssyntax}}
-例
+## 例
+
+### 太い段間罫を設定
-HTML
+#### HTML
-<p>This is a bunch of text split into three columns.
+```html
+
+ Don't you think that's wonderful?
p {
+```css
+p {
column-count: 3;
column-rule-style: solid;
column-rule-width: thick;
}
-
+```
+
+#### 結果
-{{EmbedLiveSample("Example")}}
+## 仕様書 -| 仕様書 | -状態 | -備考 | -
|---|---|---|
| {{ SpecName('CSS3 Multicol', '#crw', 'column-rule-width') }} | -{{ Spec2('CSS3 Multicol') }} | -初回定義 | -
{{cssinfo}}
+{{Compat}} -{{Compat("css.properties.column-rule-width")}}
+- [段組みレイアウト](/ja/docs/Learn/CSS/CSS_layout/Multiple-column_Layout) +- {{CSSXref("column-rule-style")}} +- {{CSSXref("column-rule-color")}} +- {{CSSXref("column-rule")}} -- cgit v1.2.3-54-g00ecf