fieldset做用户登录界面
输入:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<fieldset>
<legend>登录</legend>
<label for="username">用户名:</label>
<input id="username" type="text" name="user" />
<br />
<label for="pwd">密码:</label>
<input id="pwd" type="text" name="user" />
</fieldset>
</body>
</html>
输出:
类装饰控件
输入:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
/*
#i1{
background-color: #2459a2;
height: 48px;
}
#i2{
background-color: #2459a2;
height: 48px;
}
#i3{
background-color: #2459a2;
height: 48px;
}
.c1{
background-color: #2459a2;
height: 10px;
}
*/
/*#c2{
background-color: black;
color: white;
}
.c1 div{
background-color: black;
color: white;
}*/
.i1,.i2,.i3{
background-color: black;
color: white;
}
.c1[n='alex']{ width:100px; height:200px; }
</style>
</head>
<body>
<div class="i1">ff</div>
<div class="i2">ff</div>
<div class="i3">2</div>
<input class="c1" type="text" n="hcl">
<input class="c1" type="password">
</body>
</html>
输出: