<!DOCTYPE html>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>第三方登录</title>
<style>
body {
font-family: 'Arial', sans-serif;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
background-color: #f5f5f5;
}
.login-container {
background: white;
padding: 30px;
border-radius: 10px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
width: 320px;
text-align: center;
}
h2 {
color: #333;
margin-bottom: 25px;
}
.login-btn {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
padding: 12px;
margin-bottom: 15px;
border: none;
border-radius: 6px;
font-size: 16px;
font-weight: 500;
cursor: pointer;
transition: all 0.3s ease;
color: white;
text-decoration: none;
}
.login-btn:hover {
opacity: 0.9;
transform: translateY(-2px);
}
.btn-icon {
margin-right: 10px;
font-size: 18px;
}
/* QQ按钮样式 */
.btn-qq {
background-color: #12B7F5;
}
/* 微信按钮样式 */
.btn-wechat {
background-color: #07C160;
}
/* 微博按钮样式 */
.btn-weibo {
background-color: #E6162D;
}
/* 支付宝按钮样式 */
.btn-alipay {
background-color: #1677FF;
}
.tip {
font-size: 12px;
color: #999;
margin-top: 20px;
}
</style><div class="login-container">
<h2>选择登录方式</h2>
<!-- QQ登录按钮 -->
<a href="https://www.23zo.cn/index.php/connect?type=qq" class="login-btn btn-qq">
<span class="btn-icon">🐧</span>
QQ登录
</a>
<!-- 微信登录按钮 -->
<a href="https://www.23zo.cn/index.php/connect?type=wechat" class="login-btn btn-wechat">
<span class="btn-icon">💬</span>
微信登录
</a>
<!-- 微博登录按钮 -->
<a href="https://www.23zo.cn/index.php/connect?type=sina" class="login-btn btn-weibo">
<span class="btn-icon">🌐</span>
微博登录
</a>
<!-- 支付宝登录按钮 -->
<a href="https://www.23zo.cn/index.php/connect?type=alipay" class="login-btn btn-alipay">
<span class="btn-icon">💰</span>
支付宝登录
</a>
<p class="tip">提示:请选择您常用的第三方账号登录</p>
</div>
评论 (0)