ホームページ  >  記事  >  ウェブフロントエンド  >  チェックされたセレクターとは何ですか?チェックされたセレクターの使用方法

チェックされたセレクターとは何ですか?チェックされたセレクターの使用方法

云罗郡主
云罗郡主転載
2018-11-19 11:23:593272ブラウズ

この記事の内容は、checkedセレクターとは何かというものです。チェックされたセレクターの使用方法は、必要な友人が参考になれば幸いです。

チェックされたセレクターとは何ですか?

form 要素では、ラジオ ボタン ラジオとチェックボックス チェックボックスの両方に「チェック済み」と「チェックなし」の状態があります。 CSS3 では、:checked セレクターを使用して選択されたときに CSS スタイルを定義できます。

現在、Opera ブラウザのみがサポートしています: チェックされたセレクター。

例:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>CSS3 :checked选择器</title>
    <style type="text/css">
        input:checked
        {
            background-color:red;
        }
    </style>
</head>
<body>
    <form name="form1" method="post" action="index.html">
        性别:
        <input type="radio" name="Question1" value="boy" checked="checked"/>男
        <input type="radio" name="Question1" value="girl"/>女<br/>
        你喜欢的水果:<br />
        <input id="checkbox1" type="checkbox" checked="checked"/><label for="checkbox1">苹果</label><br/>
        <input id="checkbox2" type="checkbox" /><label for="checkbox2">香蕉</label><br/>
        <input id="checkbox3" type="checkbox" /><label for="checkbox3">西瓜</label><br/>
        <input id="checkbox4" type="checkbox" /><label for="checkbox4">凤梨</label>
    </form>
</body>
</html>

効果は次のとおりです:

チェックされたセレクターとは何ですか?チェックされたセレクターの使用方法

現在、Opera ブラウザのみが :checked セレクターをサポートしています。

上記のチェックされたセレクターは何ですか?チェックされたセレクターの使用方法の完全な紹介 CSS3 チュートリアル について詳しく知りたい場合は、PHP 中国語 Web サイトに注目してください。



以上がチェックされたセレクターとは何ですか?チェックされたセレクターの使用方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はlvyestudy.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。