---
title: 博客首页
layout: home
---

<div class="wp-home-wrapper">
  <div class="wp-home-header">
    <img src="https://q.qlogo.cn/g?b=qq&nk=3505891631&s=100" alt="fly头像" class="wp-home-avatar" />
    <div>
      <h1 class="wp-home-title">fly's Blog</h1>
      <p class="wp-home-desc">前端开发者 | 记录技术成长与生活点滴，分享有趣的世界。</p>
    </div>
  </div>
  <div class="wp-home-cards">
    <div class="wp-home-card">
      <div class="wp-home-card-icon">💻</div>
      <div class="wp-home-card-title">技术笔记</div>
      <div class="wp-home-card-desc">记录我的前端成长路。</div>
      <a href="/notes/html" class="wp-home-card-btn">进入技术笔记</a>
    </div>
    <div class="wp-home-card">
      <div class="wp-home-card-icon">🌈</div>
      <div class="wp-home-card-title">日常分享</div>
      <div class="wp-home-card-desc">音乐、书籍、美食，和生活。</div>
      <a href="/share/share" class="wp-home-card-btn wp-home-card-btn-outline">进入日常分享</a>
    </div>
  </div>
</div>

<style>
@media (max-width: 700px) {
  .vp-doc div[style*='display: flex'] { flex-direction: column !important; gap: 1.2rem !important; }
}
.vp-doc a:hover > div { transform: translateY(-6px) scale(1.03); box-shadow:0 8px 32px rgba(37,99,235,0.10); }
</style>