效果图：
完整代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>【前端实例代码】仅使用 HTML 和 CSS 的动画登录表单（超简单）</title>
<style>
body {
margin: 0;
padding: 0;
font-family: sans-serif;
background: #2D5CFE;
}
.box {
width: 300px;
padding: 40px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
/* 毛玻璃效果 */
background: rgba(0, 0, 0, .5);
}
.box h1 {
color: white;
text-transform: uppercase;
font-weight: 500;
}
.box input[type&