checked选择器如何使用

发布时间：2020-09-26 13:44:05 作者：小新
来源：亿速云阅读：147

这篇文章主要介绍checked选择器如何使用，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！

checked选择器是什么？

在表单元素中，单选按钮radio和复选框checkbox都具有“选中”和“未选中”状态。在CSS3中，我们可以通过使用：checked选择器来定义选中时的CSS样式。

暂时只有Opera浏览器支持：checked选择器。

举例：

<!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>

效果如下：

checked选择器如何使用

暂时只有opera浏览器支持:checked选择器。

以上是checked选择器如何使用的所有内容，感谢各位的阅读！希望分享的内容对大家有帮助，更多相关知识，欢迎关注亿速云行业资讯频道！

checked选择器如何使用

相关阅读