From 6aec5015ee2337ef1cc5ecd8b4f14f4009e0e9fd Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Wed, 6 Oct 2021 00:14:13 +0900 Subject: Web/CSS/CSS_Text_Decoration を更新 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 2021/10/05 時点の英語版に同期 --- files/ja/web/css/css_text_decoration/index.md | 141 ++++++++++---------------- 1 file changed, 52 insertions(+), 89 deletions(-) (limited to 'files/ja') diff --git a/files/ja/web/css/css_text_decoration/index.md b/files/ja/web/css/css_text_decoration/index.md index 5dd4da31f6..0f6145401c 100644 --- a/files/ja/web/css/css_text_decoration/index.md +++ b/files/ja/web/css/css_text_decoration/index.md @@ -9,45 +9,36 @@ tags: - Reference translation_of: Web/CSS/CSS_Text_Decoration --- -
{{CSSRef}}
- -

CSS テキスト装飾 (Text Decoration) は CSS のモジュールの一つで、下線、テキストの影、圏点など、テキスト装飾に関連する機能を定義します。

- -

リファレンス

- -

プロパティ

- -
- -
- -

ガイド

- -

なし。

- -

- -
.under {
+{{CSSRef}}
+
+**CSS テキスト装飾** (CSS Text Decoration) は CSS のモジュールの一つで、下線、テキストの影、圏点など、テキスト装飾に関連する機能を定義します。

+ +## リファレンス + +### プロパティ + +- {{cssxref("text-decoration")}} +- {{cssxref("text-decoration-color")}} +- {{cssxref("text-decoration-line")}} +- {{cssxref("text-decoration-skip-ink")}} +- {{cssxref("text-decoration-style")}} +- {{cssxref("text-decoration-thickness")}} +- {{cssxref("text-emphasis")}} +- {{cssxref("text-emphasis-color")}} +- {{cssxref("text-emphasis-position")}} +- {{cssxref("text-emphasis-style")}} +- {{cssxref("text-shadow")}} +- {{cssxref("text-underline-offset")}} +- {{cssxref("text-underline-position")}} + +### ガイド + +_なし。_ + +

+ +```css +.under {   text-decoration: underline red; } @@ -74,53 +65,25 @@ translation_of: Web/CSS/CSS_Text_Decoration .blink { text-decoration: blink; } -
- -
<p class="under">This text has a line underneath it.</p>
-<p class="over">This text has a line over it.</p>
-<p class="line">This text has a line going through it.</p>
-<p>This <a class="plain" href="#">link will not be underlined</a>,
-    as links generally are by default. Be careful when removing
-    the text decoration on anchors since users often depend on
-    the underline to denote hyperlinks.</p>
-<p class="underover">This text has lines above <em>and</em> below it.</p>
-<p class="thick">This text has a really thick purple underline in supporting browsers.</p>
-<p class="blink">This text might blink for you,
-    depending on the browser you use.</p>
-
- -

{{EmbedLiveSample('Examples','auto','320')}}

- -

仕様書

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
仕様書状態備考
{{SpecName('CSS4 Text Decoration')}}{{Spec2('CSS4 Text Decoration')}}
{{SpecName('CSS3 Text Decoration')}}{{Spec2('CSS3 Text Decoration')}}
{{SpecName('CSS2.1', 'text.html')}}{{Spec2('CSS2.1')}}
{{SpecName('CSS1')}}{{Spec2('CSS1')}}初回定義
+``` + +```html +

このテキストには下付近に 1 本の線があります。

+

このテキストの上に線があります。

+

このテキストには取り消し線があります。

+

このリンクには下線が引かれていませんが、リンクは一般的には既定で下線があります。ユーザーはハイパーリンクを示すアンダーラインを頼りにしていることが多いので、アンカーの文字装飾を削除する場合は注意が必要です。

+

このテキストには上下に線があります。

+

対応しているブラウザーでは、このテキストは実に太い紫色の下線があります。

+ +``` + +{{EmbedLiveSample('Examples','auto','320')}} + +## 仕様書 + +| 仕様書 | 状態 | 備考 | +| ------------------------------------------------ | -------------------------------------------- | ------------------ | +| {{SpecName('CSS4 Text Decoration')}} | {{Spec2('CSS4 Text Decoration')}} | | +| {{SpecName('CSS3 Text Decoration')}} | {{Spec2('CSS3 Text Decoration')}} | | +| {{SpecName('CSS2.1', 'text.html')}} | {{Spec2('CSS2.1')}} | | +| {{SpecName('CSS1')}} | {{Spec2('CSS1')}} | 初回定義 | -- cgit v1.2.3-54-g00ecf