From d4b50846930e6c4813e3a274ddac1356b5666ef7 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Tue, 4 Jan 2022 00:26:27 +0900 Subject: 2021/08/13 時点の英語版に同期 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/css/_colon_checked/index.md | 202 +++++++++++++------------------ 1 file changed, 86 insertions(+), 116 deletions(-) diff --git a/files/ja/web/css/_colon_checked/index.md b/files/ja/web/css/_colon_checked/index.md index 9132885a57..d0585ef00d 100644 --- a/files/ja/web/css/_colon_checked/index.md +++ b/files/ja/web/css/_colon_checked/index.md @@ -1,71 +1,72 @@ --- title: ':checked' -slug: 'Web/CSS/:checked' +slug: Web/CSS/:checked tags: - ':checked' - CSS - Checked - - Layout - - Pseudo-class - - Reference - - Selector + - レイアウト + - 擬似クラス + - リファレンス + - セレクター - Toggled - - Web + - ウェブ - button - checkbox - radio -translation_of: 'Web/CSS/:checked' +translation_of: Web/CSS/:checked --- -
{{CSSRef}}
+{{CSSRef}} -

:checked は CSS の擬似クラスセレクターで、ラジオボタン (<input type="radio">)、 チェックボックス (<input type="checkbox">)、 オプションボタン ({{HTMLElement("select")}} の中の {{HTMLElement("option")}}) 要素がチェックされていたり on の状態にあったりすることを表します。

+**`:checked`** は [CSS](/ja/docs/Web/CSS) の[擬似クラス](/ja/docs/Web/CSS/Pseudo-classes)セレクターで、**ラジオボタン** ([``](/ja/docs/Web/HTML/Element/input/radio))、 **チェックボックス** ([``](/ja/docs/Web/HTML/Element/input/checkbox))、 **オプションボタン** ({{HTMLElement("select")}} の中の {{HTMLElement("option")}}) 要素がチェックされていたり `on` の状態にあったりすることを表します。 -
/* すべての選択中のラジオボタン、チェックボックス、オプションボタン */
+```css
+/* すべての選択中のラジオボタン、チェックボックス、オプションボタン */
 :checked {
   margin-left: 25px;
   border: 1px solid blue;
 }
-
+``` -

ユーザーは要素をチェック/選択することでこの状態にすることができ、要素のチェックや選択を外すとこの状態から外れます。

+ユーザーは要素をチェック/選択することでこの状態にすることができ、要素のチェックや選択を外すとこの状態から外れます。 -
-

メモ: ブラウザ―は <option> を置換要素として扱うことが多いので、 :checked 擬似クラスでスタイルが適用される部分の大きさはブラウザ―によって異なります。

-
+> **Note:** ブラウザーは `