状态伪类选择器

最新推荐文章于 2024-09-10 18:52:07 发布

ztt0918

最新推荐文章于 2024-09-10 18:52:07 发布

阅读量462

点赞数

分类专栏：状态伪类选择器文章标签：状态伪类选择器

本文链接：https://blog.csdn.net/ztt0918/article/details/71899802

版权

状态伪类选择器专栏收录该内容

1 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!--用在表单元素中 -->
    <title>状态伪类选择器</title>
    <style>
        input:checked{
            color: #ff7300;
        }
        input[type="text"]:enabled{
            border: 1px solid red;
        }
          </style>

</head>
<body>

<form action="">
    <!--label标签：当鼠标点击内容时也会选中-->
    <label for="a">男</label>
    <input id="a" type="radio" name="sex" value="1"/>
    <label for="b">女</label>
    <input id="b" type="radio" name="sex" value="2"/>
    <!--点击"名字"鼠标就会跳转到输入框-->
    <label for="c">姓名</label>
    <input id="c" type="text" />
    <label for="e">地址</label>
    <input id="e" type="text" />
</form>
</body>
</html>