From 06cd7aa75fe167c7aa07d5510f1426761411dda8 Mon Sep 17 00:00:00 2001
From: KaGaMi_PC <kagamilin10271@gmail.com>
Date: Sat, 12 Jul 2025 12:27:41 +0800
Subject: [PATCH] init

---
 index.html | 282 +++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 282 insertions(+)
 create mode 100644 index.html
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..0d848f3
--- /dev/null
+++ b/index.html
@@ -0,0 +1,282 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>KaGaMi的个人网站</title>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            font-family: 'Microsoft YaHei', Arial, sans-serif;
+            line-height: 1.6;
+            color: #333;
+            background: linear-gradient(135deg, #74b9ff 0%, #6c5ce7 100%);
+            min-height: 100vh;
+        }
+
+        .container {
+            max-width: 1000px;
+            margin: 0 auto;
+            padding: 20px;
+        }
+
+        .header {
+            background: rgba(255, 255, 255, 0.95);
+            padding: 40px;
+            border-radius: 15px;
+            text-align: center;
+            margin-bottom: 30px;
+            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
+            backdrop-filter: blur(10px);
+        }
+
+        .avatar {
+            width: 120px;
+            height: 120px;
+            border-radius: 50%;
+            background: linear-gradient(45deg, #6c5ce7, #74b9ff);
+            margin: 0 auto 20px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 3rem;
+            color: white;
+            font-weight: bold;
+        }
+
+        .header h1 {
+            color: #2d3436;
+            font-size: 2.5rem;
+            margin-bottom: 10px;
+            font-weight: 600;
+        }
+
+        .header p {
+            color: #636e72;
+            font-size: 1.2rem;
+            margin-bottom: 10px;
+        }
+
+        .status {
+            display: inline-block;
+            background: #00b894;
+            color: white;
+            padding: 8px 16px;
+            border-radius: 20px;
+            font-size: 0.9rem;
+            margin-top: 10px;
+        }
+
+        .main-content {
+            display: grid;
+            grid-template-columns: 1fr 1fr;
+            gap: 30px;
+            margin-bottom: 30px;
+        }
+
+        .card {
+            background: rgba(255, 255, 255, 0.95);
+            padding: 30px;
+            border-radius: 15px;
+            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
+            backdrop-filter: blur(10px);
+            transition: transform 0.3s ease;
+        }
+
+        .card:hover {
+            transform: translateY(-5px);
+        }
+
+        .card h2 {
+            color: #2d3436;
+            margin-bottom: 20px;
+            padding-bottom: 10px;
+            border-bottom: 2px solid #6c5ce7;
+            font-size: 1.5rem;
+        }
+
+        .intro-text {
+            font-size: 1.1rem;
+            color: #636e72;
+            line-height: 1.8;
+            margin-bottom: 15px;
+        }
+
+        .hobby-list {
+            list-style: none;
+        }
+
+        .hobby-item {
+            background: #f8f9fa;
+            margin-bottom: 10px;
+            padding: 15px;
+            border-radius: 8px;
+            border-left: 4px solid #6c5ce7;
+            transition: background 0.3s ease;
+        }
+
+        .hobby-item:hover {
+            background: #e9ecef;
+        }
+
+        .hobby-item strong {
+            color: #2d3436;
+            display: block;
+            margin-bottom: 5px;
+        }
+
+        .full-width {
+            grid-column: 1 / -1;
+        }
+
+        .contact-info {
+            text-align: center;
+            background: rgba(255, 255, 255, 0.95);
+            padding: 30px;
+            border-radius: 15px;
+            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
+            backdrop-filter: blur(10px);
+        }
+
+        .contact-info h2 {
+            color: #2d3436;
+            margin-bottom: 20px;
+            font-size: 1.5rem;
+        }
+
+        .contact-item {
+            display: inline-block;
+            background: #f1f2f6;
+            padding: 10px 20px;
+            margin: 5px;
+            border-radius: 25px;
+            color: #2d3436;
+            text-decoration: none;
+            transition: background 0.3s ease;
+        }
+
+        .contact-item:hover {
+            background: #ddd6fe;
+        }
+
+        .footer {
+            text-align: center;
+            color: white;
+            padding: 20px;
+            background: rgba(0, 0, 0, 0.2);
+            border-radius: 15px;
+            margin-top: 30px;
+        }
+
+        .beian-notice {
+            background: rgba(255, 255, 255, 0.9);
+            color: #636e72;
+            padding: 15px;
+            border-radius: 8px;
+            margin-top: 15px;
+            font-size: 0.9rem;
+        }
+
+        @media (max-width: 768px) {
+            .main-content {
+                grid-template-columns: 1fr;
+            }
+            
+            .header h1 {
+                font-size: 2rem;
+            }
+            
+            .container {
+                padding: 10px;
+            }
+        }
+    </style>
+</head>
+<body>
+    <div class="container">
+        <header class="header">
+            <div class="avatar">K</div>
+            <h1>KaGaMi</h1>
+            <p>游戏爱好者 · 在校大学生</p>
+            <p>热爱生活，享受学习的每一天</p>
+            <span class="status">在线学习中</span>
+        </header>
+
+        <div class="main-content">
+            <div class="card">
+                <h2>关于我</h2>
+                <p class="intro-text">
+                    大家好！我是KaGaMi，一名在校大学生。我对游戏有着浓厚的兴趣，喜欢在游戏中探索不同的世界和体验。
+                </p>
+                <p class="intro-text">
+                    除了游戏，我也热爱学习新知识，特别是计算机相关的技术。我相信通过不断学习和实践，可以让自己变得更好。
+                </p>
+                <p class="intro-text">
+                    我的人生格言是：保持好奇心，永远在路上！
+                </p>
+            </div>
+
+            <div class="card">
+                <h2>兴趣爱好</h2>
+                <ul class="hobby-list">
+                    <li class="hobby-item">
+                        <strong>🎮 游戏</strong>
+                        喜欢各类游戏，特别是策略类和角色扮演类游戏
+                    </li>
+                    <li class="hobby-item">
+                        <strong>📚 学习</strong>
+                        热爱学习新技术，关注互联网和科技发展
+                    </li>
+                    <li class="hobby-item">
+                        <strong>💻 编程</strong>
+                        对编程有浓厚兴趣，正在学习各种编程语言
+                    </li>
+                    <li class="hobby-item">
+                        <strong>🎵 音乐</strong>
+                        喜欢听音乐，各种类型都有涉猎
+                    </li>
+                </ul>
+            </div>
+
+            <div class="card full-width">
+                <h2>我的目标</h2>
+                <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px;">
+                    <div style="text-align: center; padding: 20px; background: #f8f9fa; border-radius: 10px;">
+                        <h3 style="color: #6c5ce7; margin-bottom: 10px;">📖 学业发展</h3>
+                        <p>努力学习专业课程，提高自己的学术水平和专业技能</p>
+                    </div>
+                    <div style="text-align: center; padding: 20px; background: #f8f9fa; border-radius: 10px;">
+                        <h3 style="color: #74b9ff; margin-bottom: 10px;">🚀 技能提升</h3>
+                        <p>不断学习新技术，提升自己的编程和技术能力</p>
+                    </div>
+                    <div style="text-align: center; padding: 20px; background: #f8f9fa; border-radius: 10px;">
+                        <h3 style="color: #00b894; margin-bottom: 10px;">🌟 个人成长</h3>
+                        <p>保持积极向上的心态，全面发展自己的综合素质</p>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <div class="contact-info">
+            <h2>联系方式</h2>
+            <p style="margin-bottom: 20px; color: #636e72;">欢迎志同道合的朋友一起交流学习！</p>
+            <span class="contact-item">📧 邮箱联系</span>
+            <span class="contact-item">💬 在线交流</span>
+            <span class="contact-item">🎮 游戏好友</span>
+        </div>
+
+        <footer class="footer">
+            <p>&copy; 2024 KaGaMi的个人网站. 版权所有</p>
+            <p>一个热爱学习和游戏的大学生的个人空间</p>
+            <!-- <div class="beian-notice">
+                本网站内容健康向上，符合国家相关法律法规要求，接受社会监督
+            </div> -->
+        </footer>
+    </div>
+</body>
+</html> 
\ No newline at end of file
