From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/ja/web/css/@page/bleed/index.html | 81 +++++++++++++++++++ files/ja/web/css/@page/index.html | 110 +++++++++++++++++++++++++ files/ja/web/css/@page/marks/index.html | 86 ++++++++++++++++++++ files/ja/web/css/@page/size/index.html | 139 ++++++++++++++++++++++++++++++++ 4 files changed, 416 insertions(+) create mode 100644 files/ja/web/css/@page/bleed/index.html create mode 100644 files/ja/web/css/@page/index.html create mode 100644 files/ja/web/css/@page/marks/index.html create mode 100644 files/ja/web/css/@page/size/index.html (limited to 'files/ja/web/css/@page') diff --git a/files/ja/web/css/@page/bleed/index.html b/files/ja/web/css/@page/bleed/index.html new file mode 100644 index 0000000000..83bc2b853c --- /dev/null +++ b/files/ja/web/css/@page/bleed/index.html @@ -0,0 +1,81 @@ +--- +title: bleed +slug: Web/CSS/@page/bleed +tags: + - '@page' + - CSS + - CSS ページ化メディア + - CSS 記述子 + - Experimental + - Reference + - bleed + - ウェブ +translation_of: Web/CSS/@page/bleed +--- +
{{CSSRef}}{{SeeCompatTable}}
+ +

CSS の bleed @-規則記述子は、 {{cssxref("@page")}} @-規則で使用し、ページボックスの外にあるページの裁ち落とし領域の大きさを指定します。このプロパティは、 {{cssxref("@page/marks", "marks")}} プロパティを使用して裁ち落とし記号を有効にしている場合のみ効果があります。

+ +

{{cssinfo}}

+ +

構文

+ +
/* キーワード値 */
+bleed: auto;
+
+/* <length> 値 */
+bleed: 8pt;
+bleed: 1cm;
+
+ +

値

+ +
+
auto
+
{{cssxref("@page/marks", "marks")}} が crop の場合、 6pt に計算します。それ以外の場合はゼロに計算します。
+
{{cssxref("<length>")}}
+
ページボックスの外に裁ち落とし領域を、各方向に、どれだけ広げるかを指定します。値は負の数にすることができますが、実装に依存する制限があるかもしれません。
+
+ +

形式文法

+ +
{{csssyntax}}
+ +

例

+ +
@page {
+  bleed: 1cm;
+}
+
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("CSS3 Paged Media", "#bleed", "bleed")}}{{Spec2("CSS3 Paged Media")}}初回定義。
+ +

ブラウザーの対応

+ + + +

{{Compat("css.at-rules.page.bleed")}}

+ +

関連情報

+ + diff --git a/files/ja/web/css/@page/index.html b/files/ja/web/css/@page/index.html new file mode 100644 index 0000000000..a03ac2dff6 --- /dev/null +++ b/files/ja/web/css/@page/index.html @@ -0,0 +1,110 @@ +--- +title: '@page' +slug: Web/CSS/@page +tags: + - '@page' + - At-rule + - CSS + - Layout + - Reference + - Web +translation_of: Web/CSS/@page +--- +
{{CSSRef}}
+ +

@page は CSS のアット規則で、文書を印刷するときに一部の CSS プロパティを変更するために使用します。

+ +

構文

+ +
@page {
+  margin: 1cm;
+}
+
+@page :first {
+  margin: 2cm;
+}
+ +

記述子

+ +
+
size
+
対象となるページボックスの包含ブロックの寸法と向きを指定します。一般的な場合、1つのページボックスが1枚の用紙に印刷され、対象となる用紙の寸法を示します。
+
+ +
+
marks
+
クロップや登録マークを文書に追加します。
+
+ +
+
bleed
+
ページのレンダリングがクリップされた場合の、ページボックス間の距離を示します。
+
+ +

解説

+ +

@page ですべての CSS プロパティを変更できるわけではありません。変更できるのは、 margin, orphans, widows と、文書のページ区切りだけです。これ以外の CSS プロパティを変えようとしても、無視されます。

+ +

@page アット規則は、 CSS オブジェクトモデルインターフェイス {{domxref("CSSPageRule")}} からアクセスできます。

+ +
注: W3C は、ビューポートに関する {{cssxref("<length>")}} の単位、 vh, vw, vmin, vmax の取り扱い方について議論中です。差し当たっては、これらを @page アット規則の中で使わないでください。
+ +

形式文法

+ +
{{csssyntax}}
+ +

例

+ +

@page 擬似クラスの例

+ +

@page の さまざまな擬似クラスのページにある例を参照してください。

+ + + +

仕様書

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('CSS Logical Properties', '#page', ':recto and :verso')}}{{Spec2('CSS Logical Properties')}}:recto 及び :verso ページセレクターを追加
{{SpecName('CSS3 Paged Media', '#at-page-rule', '@page')}}{{Spec2('CSS3 Paged Media')}}{{SpecName('CSS2.1')}} から変更はないが、 @page 内でより多くの＠規則が利用できるようになった。
{{SpecName('CSS2.1', 'page.html#page-selectors', '@page')}}{{Spec2('CSS2.1')}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("css.at-rules.page")}}

+ +

関連情報

+ + diff --git a/files/ja/web/css/@page/marks/index.html b/files/ja/web/css/@page/marks/index.html new file mode 100644 index 0000000000..eaced148e4 --- /dev/null +++ b/files/ja/web/css/@page/marks/index.html @@ -0,0 +1,86 @@ +--- +title: marks +slug: Web/CSS/@page/marks +tags: + - '@page' + - CSS + - CSS ページ化メディア + - CSS 記述子 + - Experimental + - Reference + - ウェブ + - レイアウト +translation_of: Web/CSS/@page/marks +--- +
{{CSSRef}}{{SeeCompatTable}}
+ +

CSS の marks @-規則記述子は、 {{cssxref("@page")}} @-規則で使用し、文書の表現に対して裁ち落とし記号や十字記号を追加します。裁ち落とし記号はページを切断するべき場所を示します。十字記号はシートの配置のために使用します。

+ +

裁ち落とし記号や十字記号はページボックスの外側に印刷されます。裁ち落とし記号や十字記号を表示する余地を確保するため、最終的なページはページボックスよりいくらか大きくする必要があります。

+ +

{{cssinfo}}

+ +

構文

+ +
/* キーワード値 */
+marks: none;
+marks: crop;
+marks: cross;
+marks: crop cross;
+
+ +

値

+ +
+
crop
+
裁ち落とし記号を表示します。
+
cross
+
十字記号を表示します。
+
none
+
記号を表示しません。
+
+ +

形式文法

+ +
{{csssyntax}}
+ +

例

+ +
@page {
+  marks: crop cross;
+}
+
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('CSS3 Paged Media', '#marks', 'marks')}}{{Spec2('CSS3 Paged Media')}}初回定義。
+ +

この CSS プロパティは当初は CSS Level 2 で提案されましたが、 CSS Level 2 (Revision 1) で落とされました。

+ +

ブラウザーの対応

+ + + +

{{Compat("css.at-rules.page.marks")}}

+ +

関連情報

+ + diff --git a/files/ja/web/css/@page/size/index.html b/files/ja/web/css/@page/size/index.html new file mode 100644 index 0000000000..5193209c53 --- /dev/null +++ b/files/ja/web/css/@page/size/index.html @@ -0,0 +1,139 @@ +--- +title: size +slug: Web/CSS/@page/size +tags: + - '@page' + - At-rule descriptor + - CSS + - CSS Descriptor + - Experimental + - NeedsBrowserCompatibility + - Reference + - Web +translation_of: Web/CSS/@page/size +--- +
{{CSSRef}}{{SeeCompatTable}}
+ +

CSS の size アット規則記述子は、 {{cssxref("@page")}} アット規則で使用し、ページを表現するために使用するボックスの寸法と向きを定義します。多くの場合、この寸法は印刷ページの適用可能な対象の寸法に対応します。

+ +

寸法は「拡縮可能な」キーワード (この場合、ページの有効な大きさ全体を使用します) 又は絶対的な長さのどちらかで定義します。

+ +

構文

+ +
/* 拡縮可能な寸法のキーワード値 */
+size: auto;
+size: portrait;
+size: landscape;
+
+/* <length> 値 */
+/* 1 値: 高さ = 幅 */
+size: 6in;
+
+/* 2 値: 幅の後に高さ*/
+size: 4in 6in;
+
+/* 絶対寸法のキーワード値 */
+size: A4;
+size: B5;
+size: JIS-B4;
+size: letter;
+
+/* 寸法と方向の混合 */
+size: A4 portrait;
+
+ +

値

+ +
+
auto
+
ユーザーエージェントがページの寸法を決定します。多くの場合、対象となる用紙の寸法と向きが使用されます。
+
landscape
+
ページのコンテンツは横向きモード (ボックスの長辺が水平) で表示されます。
+
portrait
+
ページのコンテンツは縦向きモード (ボックスの長辺が垂直) で表示されます。これが既定の向きです。
+
<length>
+
何らかの長さの値 ({{cssxref("<length>")}} を参照)。最初の値はページボックスの幅に対応し、二番目の値は高さに対応します。一つしか値が提供されない場合は、幅と高さの両方に使用されます。
+
<page-size>
+
+
+
A5
+
これは標準の ISO の寸法 148mm x 210mm に一致します。
+
A4
+
これは標準の ISO の寸法 210mm x 297mm に一致します。 (個人の印刷では最もよく使われる寸法です。)
+
A3
+
これは標準の ISO の寸法 297mm x 420mm に一致します。
+
B5
+
これは標準の ISO の寸法 176mm x 250mm に一致します。
+
B4
+
これは標準の ISO の寸法 250mm x 353mm に一致します。
+
JIS-B5
+
これは JIS 標準の寸法 182mm x 257mm に対応します。
+
JIS-B4
+
これは JIS 標準の寸法 257mm x 364mm に対応します。
+
letter
+
このキーワードは北米のレター用紙の寸法、すなわち 8.5in x 11in と同等です。
+
legal
+
このキーワードは北米のリーガル用紙の寸法、すなわち 8.5in x 14in と同等です。
+
ledger
+
このキーワードは北米の ledger 用紙の寸法、すなわち 11in x 17in と同等です。
+
+
+
+ +

公式定義

+ +

{{cssinfo}}

+ +

形式文法

+ +
{{csssyntax}}
+ +

例

+ +

寸法と向きの指定

+ +
@page {
+  size: 4in 6in landscape;
+}
+
+ +

@media 規則内部の入れ子

+ +
@media print {
+  @page {
+    size: 50mm 150mm;
+  }
+}
+
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('CSS3 Paged Media', '#page-size-prop', 'size')}}{{Spec2('CSS3 Paged Media')}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("css.at-rules.page.size")}}

+ +

関連情報

+ + -- cgit v1.2.3-54-g00ecf