状态伪类:注册表格

2022年09月23日 18:10:14阅读数:67博客 / 叶志鹏 /


<!DOCTYPE html>

<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<form action="">
<fieldset>
<legend>个人中心登录</legend>
<label >用户姓名:<input type="text">
</label>
<br>
<label for="tips">警告:</label>
<input type="text" id="urname" value="没注册别乱点 没为什么" disabled style="border: none;">

<div>
<label for="g">性别:</label>
<input type="radio" name="sex" id="male" value="0" checked>
<label for="male">男</label>
<input type="radio" name="sex" id="female" value="1" >
<label for="female">女</label>
<input type="radio" name="sex" id="seceret" value="3" >
<label for="male">秘密</label>
</div>
<button>提交</button>
</fieldset>
</form>

<style>
input:disabled {
color:green;
background-color: #ccc;
}

input:checked + label {
color: palevioletred;
}
input:focus {
background-color: lightsalmon;
}
button {
height: 30px;
border-radius: 40%;
outline: none;
background-color: lightseagreen;
border: 1px;
color: blanchedalmond;
}

button:hover {
cursor: pointer;
background-color: violet;
}
</style>
</body>
</html>

版权申明:本博文版权归博主所有,转载请注明地址!如有侵权、违法,请联系admin@php.cn举报处理!

全部评论

文明上网理性发言,请遵守新闻评论服务协议

条评论
  • 博主信息
    叶志鹏
    博文
    5
    粉丝
    0
    评论
    0
    访问量
    382
    积分:0
    P豆:18