gwng
/
gwng-pythonweb


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
							<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>个人主页 | Java程序员</title>
    <!-- Bootstrap 5 CSS CDN -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- 极少量自定义样式，仅作微调 -->
    <style>
        .avatar {
            width: 140px;
            height: 140px;
            object-fit: cover;
            border-radius: 50%;
            border: 3px solid #fff;
            box-shadow: 0 4px 8px rgba(0,0,0,0.1);
        }
        .skill-badge {
            background-color: #e9ecef;
            color: #2c3e50;
            padding: 0.4rem 1rem;
            border-radius: 2rem;
            font-weight: 500;
            transition: all 0.2s;
        }
        .skill-badge:hover {
            background-color: #0d6efd;
            color: white;
            transform: translateY(-2px);
        }
        .project-card {
            transition: transform 0.2s;
        }
        .project-card:hover {
            transform: translateY(-5px);
        }
        footer {
            font-size: 0.85rem;
        }
    </style>
</head>
<body class="bg-light">

    <!-- 主体内容 -->
    <div class="container my-5">
        <!-- 头像与基本信息 -->
        <div class="row justify-content-center mb-4">
            <div class="col-md-8 text-center">
                <img src="https://ts1.tc.mm.bing.net/th/id/OIP-C.AQGk9qeTNhgOj7L_HkbBRwAAAA?w=199&h=211&c=8&rs=1&qlt=90&o=6&pid=2.1&rm=2" alt="头像" class="avatar mb-3">
                <h2 class="fw-bold">黄略</h2>
                <p class="lead text-secondary">Java程序员 | 后端开发 | 技术爱好者</p>
            </div>
        </div>

        <!-- 关于我 -->
        <div class="card shadow-sm mb-4">
            <div class="card-body">
                <h3 class="card-title h5 fw-bold border-start border-primary border-4 ps-3">📌 关于我</h3>
                <p class="card-text mt-3">
                    计算机专业毕业，热爱编程与系统设计。具备扎实的Java基础，熟悉主流框架和微服务架构。
                    乐于团队协作，追求简洁高效的代码。持续学习新技术，致力于构建稳定、可扩展的后端服务。
                </p>
            </div>
        </div>

        <!-- 掌握技能 -->
        <div class="card shadow-sm mb-4">
            <div class="card-body">
                <h3 class="card-title h5 fw-bold border-start border-primary border-4 ps-3">⚙️ 掌握技能</h3>
                <div class="d-flex flex-wrap gap-2 mt-3">
                    <span class="skill-badge">Java / Spring Boot</span>
                    <span class="skill-badge">Spring Cloud / Alibaba</span>
                    <span class="skill-badge">MySQL / PostgreSQL</span>
                    <span class="skill-badge">Redis / RabbitMQ</span>
                    <span class="skill-badge">MyBatis / JPA</span>
                    <span class="skill-badge">Docker / Kubernetes</span>
                    <span class="skill-badge">Git / Maven</span>
                    <span class="skill-badge">Linux / Nginx</span>
                    <span class="skill-badge">HTML / CSS / Bootstrap</span>
                </div>
            </div>
        </div>


        <!-- 联系我 -->
        <div class="card shadow-sm mb-4">
            <div class="card-body">
                <h3 class="card-title h5 fw-bold border-start border-primary border-4 ps-3">📬 联系我</h3>
                <ul class="list-group list-group-flush mt-3">
                    <li class="list-group-item d-flex justify-content-between align-items-center">
                        <span>📧 Email</span>
                        <span class="text-secondary">adad.li@ada.com</span>
                    </li>
                    <li class="list-group-item d-flex justify-content-between align-items-center">
                        <span>📱 手机</span>
                        <span class="text-secondary">+86 123 4567 8901</span>
                    </li>
                    <li class="list-group-item d-flex justify-content-between align-items-center">
                        <span>🏠 地址</span>
                        <span class="text-secondary">白云区良田中路191号</span>
                    </li>
                    <li class="list-group-item d-flex justify-content-between align-items-center">
                        <span>💻 GitHub</span>
                        <span class="text-secondary">github.com/adsd-li</span>
                    </li>
                </ul>
            </div>
        </div>

    </div>

    <!-- Bootstrap JS Bundle (可选，用于某些交互) -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>