粒子波动流登录界面-html代码-BFW代码库

粒子波动流登录界面

代码语言：html

代码描述：粒子波动流登录界面

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">
	<head>

		<style>
			body {
				margin: 0;
				overflow: hidden;
				background: linear-gradient(to bottom, #19778c, #095f88);
				background-size:1400% 300%;
				animation: dynamics 6s ease infinite;
				-webkit-animation: dynamics 6s ease infinite;
				-moz-animation: dynamics 6s ease infinite;
				font-size: 14px;
				color: #ffffff;
				min-height: 700px;
			}
			/*登录样式*/
			.main {
				position: fixed;
				text-align: center;
				top: 182px;
				width: 100%;
				height: auto;
				display: flex;
				justify-content: center;
			}
			.login {
				width: 470px;
				height:470px;
				background: linear-gradient(to bottom, #19778c, #095f88);
				animation: dynamics 6s ease infinite;
				-webkit-animation: dynamics 6s ease infinite;
				-moz-animation: dynamics 6s ease infinite;
				opacity: 0.9;
				border: solid 1px #13a1fc;
				background-size:1400% 300%;
			}
			@keyframes dynamics {
				0% {
					background-position: 0% 0%;
				}
				50% {
					background-position: 50% 100%;
				}
				100% {
					background-position: 100% 0%;
				}
			}
			.log-con {
				background: linear-gradient(#13a1fc, #13a1fc) left top, linear-gradient(#13a1fc, #13a1fc) left top,
				linear-gradient(#13a1fc, #13a1fc) right top, linear-gradient(#13a1fc, #13a1fc) right top,
				linear-gradient(#13a1fc, #13a1fc) left bottom, linear-gradient(#13a1fc, #13a1fc) left bottom,
				linear-gradient(#13a1fc, #13a1fc) right bottom, linear-gradient(#13a1fc, #13a1fc) right bottom;
				background-repeat: no-repeat;
				background-size: 3px 20px, 20px 3px;
				height: 100%;
				margin: -2px;
				padding: 3px 1px 1px 0;
				border-radius: 3px;
			}
			.log-con &.........完整代码请登录后点击上方下载按钮下载查看