From b9f7e5dd90513ae416c00815ffa814bc2575baa5 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Sat, 4 Dec 2021 03:24:58 +0900 Subject: 2021/12/01 時点の英語版に同期 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit CSS Fragmentation 関連の文書を更新 --- files/ja/web/css/orphans/index.md | 110 ++++++++++++++++---------------------- 1 file changed, 45 insertions(+), 65 deletions(-) (limited to 'files/ja/web/css/orphans') diff --git a/files/ja/web/css/orphans/index.md b/files/ja/web/css/orphans/index.md index 1621e1d75f..dab873603d 100644 --- a/files/ja/web/css/orphans/index.md +++ b/files/ja/web/css/orphans/index.md @@ -5,57 +5,61 @@ tags: - CSS - CSS プロパティ - CSS 断片化 - - Reference + - リファレンス - Web translation_of: Web/CSS/orphans --- -
{{CSSRef}}
+{{CSSRef}} -

orphansCSS のプロパティで、ページ、領域、最下部に表示されるブロックコンテナーの最小行数を設定します。

+**`orphans`** は [CSS](/ja/docs/Web/CSS) のプロパティで、[ページ](/ja/docs/Web/CSS/Paged_Media)、領域、[段](/ja/docs/Web/CSS/CSS_Columns)の*最下部*に表示されるブロックコンテナーの最小行数を設定します。 -
/* <integer> 値 */
+```css
+/*  値 */
 orphans: 2;
 orphans: 3;
 
 /* Global values */
 orphans: inherit;
 orphans: initial;
+orphans: revert;
 orphans: unset;
-
+``` -
-

組版において、 orphan とは段落の最初の行がページの末尾に単独で現れることです。 (段落は次のページへ続きます。)

-
+組版において、オルファン (_orphan_) とは段落の最初の行がページの末尾に単独で現れることです。 (段落は次のページへ続きます。) + +## 構文 -

{{cssinfo}}

+### 値 -

構文

+- {{cssxref("<integer>")}} + - : 区切りの前の新しい断片の末尾に残すことができる最小行数です。値は正の数である必要があります。 -

+## 公式定義 -
-
{{cssxref("<integer>")}}
-
区切りの前の新しい断片の末尾に残すことができる最小行数です。値は正の数である必要があります。
-
+{{cssinfo}} -

形式文法

+## 形式文法 {{csssyntax}} -

+## 例 + +### オルファンを 3 行の大きさに設定 -

HTML

+#### HTML -
<div>
-  <p>これは幾らかのテキストを含む最初の段落です。</p>
-  <p>これは最初の段落よりも多くのテキストを含む第二の段落です。これは widow がどの様に動作するのかを示すために用います。</p>
-  <p>これは第三の段落です。これは最初の段落よりも少しだけ長いテキストを含んでいます。</p>
-</div>
-
+```html +
+

これは幾らかのテキストを含む最初の段落です。

+

これは最初の段落よりも多くのテキストを含む第二の段落です。これは orphans がどの様に動作するのかを示すために用います。

+

これは第三の段落です。これは最初の段落よりも少しだけ長いテキストを含んでいます。

+
+``` -

CSS

+#### CSS -
div {
+```css
+div {
   background-color: #8cffa0;
   height: 150px;
   columns: 3;
@@ -69,45 +73,21 @@ p {
 p:first-child {
   margin-top: 0;
 }
-
- -

結果

- -

{{EmbedLiveSample("Example", 380, 150)}}

- -

仕様書

- - - - - - - - - - - - - - - - - - - - - -
仕様書状態備考
{{SpecName('CSS3 Fragmentation', '#widows-orphans', 'orphans')}}{{Spec2('CSS3 Fragmentation')}}orphans をページ、領域、段など、断片の種類によらず適用するように拡張
{{SpecName('CSS2.1', 'page.html#break-inside', 'orphans')}}{{Spec2('CSS2.1')}}初回定義
- -

ブラウザーの対応

+``` -
-

{{Compat("css.properties.orphans")}}

-
+#### 結果 + +{{EmbedLiveSample("Setting_a_minimum_orphan_size_of_three_lines", 380, 150)}} + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} -

関連情報

+## 関連情報 - +- {{cssxref("widows")}} +- [ページ化メディア](/ja/docs/Web/CSS/Paged_Media) -- cgit v1.2.3-54-g00ecf