代码1
<body>
<div class="box">
<div class="content">
<div class="login-warpper">
<h1>登录</h1>
<div class="login-from">
<div class="phone">
<span class="span-phone">使用账号或者手机号</span>
<input type="text" class="input-phone">
</div>
<div class="password phone">
<span class="span-password span-phone">密码</span>
<div class="input-item">
<input type="password" class="input-password input-phone">
<span class="icon"><img src="./asset/Login®ister1/眼睛-闭眼.png" alt="" id="img"></span>
</div>
</div>
<button class="login-btn">登 录</button>
</div>
<div class="divider">
<span class="line"></span>
<span class="divider-text">其他方式登录</span>
<span class="line"></span>
</div>
<div class="other-login">
<div class="other-login-qq">
<img src="./asset/Login®ister1/QQ.png" alt="">
</div>
<div class="other-login-vx">
<img src="./asset/Login®ister1/WeChat.png" alt="">
</div>
</div>
</div>
</div>
</div> 
代码2
<body>
<div class="box">
<div class="content">
<div class="login">
<div class="mask">
<div class="login-content">
<h2>登录</h2>
<span class="span-content">欢迎来到登录界面，您可以通过这个界面登录，也可以通过其他方式实现登录</span>
<div class="logo">
<img src="./asset/Login®ister2/QQ.png" alt="">
<span>使用QQ登录</span>
</div>
<div class="input-content">
<input type="text" placeholder="账号:">
<input type="password" placeholder="密码:">
</div>
<button class="login-btn">登录</button>
<div class="other-tips">
<span class="other-span">还没有账号？</span>
<span class="blue">注册</span>
</div>
</div>
</div>
</div>
</div>
</div> 
代码3
<body>
<div class="content">
<div class="title">登录</div>
<input type="text" placeholder="账号">
<input type="password" placeholder="密码">
<button class="btn">Login</button>
<span>没有账号?<a href="#">注册</a></span>
</div>
<div class="square">
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
<div class="circle">
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</body>
代码4
<body>
<div class="content right-panel-active">
<div class="content-singUp content-from">
<!-- 注册 -->
<form action="javascript:;" class="form" id="form1">
<h2 class="from-title from-title1">注 册</h2>
<input type="text" placeholder="账号:" class="input">
<input type="email" placeholder="邮箱:" class="input">
<div class="input-item">
<input type="password" class="input input0" placeholder="密码:">
<span class="icon icon0"><img src="./asset/Login®ister1/眼睛-闭眼.png" alt="" id="img0"></span>
</div>
<div class="input-item">
<input type="password" class="input input1" placeholder="确认密码:">
<span class="icon icon1"><img src="./asset/Login®ister1/眼睛-闭眼.png" alt="" id="img1"></span>
</div>
<button class="btn">注册</button>
</form>
</div>
<!-- 登录 -->
<div class="content-login content-from">
<form action="javascript:;" id="form2" class="form">
<h2 class="from-title">登 录</h2>
<input type="text" placeholder="用户名" class="input">
<div class="input-item">
<input type="password" class="input2 input" placeholder="密 码">
<span class="icon2 icon"><img src="./asset/Login3/眼睛-闭眼.png" alt="" id="img2"></span>
</div>
<a href="#" class="link">找回密码</a>
<button class="btn">登录</button>
</form>
</div>
<div class="container_overlay">
<div class="overlay">
<div class="overlay_panel overlay--left">
<button class="btn" id="signIn">Sign In</button>
</div>
<div class="overlay_panel overlay--right">
<button class="btn" id="signUp">Sign Up</button>
</div>
</div>
</div>
</div>需要代码的小伙伴可以在评论区拿哦！！！
