From 46c5830e37ec4d70f5a9331ef8878c155636a612 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Fri, 31 Dec 2021 11:56:22 +0900 Subject: 2021/08/13 時点の英語版に同期 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/css/text-combine-upright/index.md | 141 +++++++++++++------------ 1 file changed, 71 insertions(+), 70 deletions(-) (limited to 'files') diff --git a/files/ja/web/css/text-combine-upright/index.md b/files/ja/web/css/text-combine-upright/index.md index c7d8790ecd..d5af954139 100644 --- a/files/ja/web/css/text-combine-upright/index.md +++ b/files/ja/web/css/text-combine-upright/index.md @@ -5,17 +5,20 @@ tags: - CSS - CSS プロパティ - CSS 書字方向 - - Experimental - - Reference + - 実験的 + - リファレンス + - recipe:css-property +browser-compat: css.properties.text-combine-upright translation_of: Web/CSS/text-combine-upright --- -
{{CSSRef}}
+{{CSSRef}} -

text-combine-upright は CSS のプロパティで、一文字分の空間に挿入する文字の組み合わせを設定します。組み合わせたテキストが 1em の幅より広い場合、ユーザーエージェントはコンテンツを 1em の幅に収める必要があります。合成結果は、レイアウトおよび装飾においてグリフ一文字として扱われます。このプロパティは、縦書きモードでのみ効果があります。

+**`text-combine-upright`** は [CSS](/ja/docs/Web/CSS) のプロパティで、一文字分の空間に挿入する文字の組み合わせを設定します。組み合わせたテキストが 1em の幅より広い場合、ユーザーエージェントはコンテンツを 1em の幅に収めなければなりません。合成結果は、レイアウトおよび装飾においてグリフ一文字として扱われます。このプロパティは、縦書きモードでのみ効果があります。 -

これは、日本語の縦中横 (tate-chū-yoko)、中国語の 直書橫向 として知られる効果をもたらすために使用されます。

+これは、日本語の縦中横、中国語の 直書橫向 として知られる効果をもたらすために使用されます。 -
/* キーワード値 */
+```css
+/* キーワード値 */
 text-combine-upright: none;
 text-combine-upright: all;
 
@@ -26,88 +29,86 @@ text-combine-upright: digits 4;   /* 4 桁までの数字を垂直テキスト
 /* グローバル値 */
 text-combine-upright: inherit;
 text-combine-upright: initial;
+text-combine-upright: revert;
 text-combine-upright: unset;
-
+``` -

{{cssinfo}}

+## 構文 -

構文

+### 値 -

値

+- `none` + - : 何も特別な処理をしません。 +- `all` + - : タイプセットのすべての文字を水平に並べてボックス内に収めます。この幅は、縦書きボックス内で一文字分の空間を取ります。 +- `digits ?` + - : 指定した桁数 (整数値) までの連続した ASCII 数字 (U+0030–U+0039) を水平に並べてボックス内に収めます。この幅は、縦書きボックス内で一文字分の空間を取ります。整数値を省略した場合の値は 2 になります。2 ～ 4 までの範囲外の整数値は不正です。 -
-
none
-
何も特別な処理をしません。
-
all
-
タイプセットのすべての文字を水平に並べてボックス内に収めます。この幅は、縦書きボックス内で一文字分の空間を取ります。
-
digits <integer>?
-
指定した桁数 (整数値) までの連続した ASCII 数字 (U+0030–U+0039) を水平に並べてボックス内に収めます。この幅は、縦書きボックス内で一文字分の空間を取ります。整数値を省略した場合の値は 2 になります。2 ～ 4 までの範囲外の整数値は不正です。
-
+## 公式定義 -

形式文法

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

例 (digits)

+## 例 + +### digits + +digits 値は、数字の桁を組み合わせる際に all の値よりもマークアップが少なくてすみますが、対応しているブラウザーはあまり多くありません。 + +#### HTML -

digits 値は、数字の桁だけを組み合わせる場合に使用し、all 値よりも必要なマークアップが少なくてすみます。現在、これをサポートしているブラウザーはあまりありません。

+```html +

平成20年4月16日に

+``` -
<p lang="ja" class="exampleText">平成20年4月16日に</p>
-
+#### CSS -
.exampleText {
+```css
+.exampleText {
   writing-mode: vertical-lr;
   text-combine-upright: digits 2;
   font: 36px serif;
-}
+} +``` -

{{EmbedLiveSample("Example_digits", 100, 350, "https://mdn.mozillademos.org/files/12127/tate-chu-yoko.png")}}

+#### 結果 -

例 (all)

+{{EmbedLiveSample("Digits", 100, 350, "tate-chu-yoko.png")}} -

all 値は、水平テキストにするすべての部分にマークアップする必要があります。現在、これは digits 値よりも多くのブラウザーでサポートされています。

+### all -
<p lang="zh-Hant">民國<span class="num">105</span
->年<span class="num">4</span
->月<span class="num">29</span>日</p>
-
+all の値は、水平テキストにするすべての部分にマークアップする必要があります。現在、これは digits 値よりも多くのブラウザーが対応しています。 -
html { writing-mode: vertical-rl; font: 24px serif }
+#### HTML
+
+```html
+
民國105年4月29日

+```
+
+#### CSS
+
+```css
+html { writing-mode: vertical-rl; font: 24px serif }
 .num { text-combine-upright: all }
-
- -

{{EmbedLiveSample("Example_all", 250, 300, "https://mdn.mozillademos.org/files/13096/text-combine-upright-all.png")}}

- -

仕様書

- - - - - - - - - - - - - - - - - - - - - -
仕様書状態備考
{{SpecName("CSS4 Writing Modes", "#propdef-text-combine-upright", "text-combine-upright")}}{{Spec2("CSS4 Writing Modes")}}digits 値の追加
{{SpecName("CSS3 Writing Modes", "#propdef-text-combine-upright", "text-combine-upright")}}{{Spec2("CSS3 Writing Modes")}}初回定義
- -

ブラウザーの互換性

- -

{{Compat("css.properties.text-combine-upright")}}

- -

関連情報

- - +``` + +#### 結果 + +{{EmbedLiveSample("All", 250, 300, "text-combine-upright-all.png")}} + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- {{cssxref("writing-mode")}}, {{cssxref("text-orientation")}} -- cgit v1.2.3-54-g00ecf