流光登录选项卡(html+css)

分享用html和css写一个炫酷一点的登录选项卡

先上最终效果图

1、html结构

<div class="main">
			<h1>login</h1>
			<form>
				<div>
					<input type="text" name="UserName" id="UserName">
					<label for="UserName">username</label>

				</div>
				<div>
					<input type="password" name="Password" id="Password">
					<label for="Password">password</label>
				</div>

				<button class="btn">submit
					<span></span>
					<span></span>
					<span></span>
					<span></span>
				</button>
			</form>
</div>

1. 通过input的伪类来控制label标签的位置和字体大小的话，