兴趣展示页

项目四：为热爱做一个专题页

📖知识引入

🌟兴趣主题页

恐龙、足球、天文、二次元、猫咪……你最懂什么，就做什么主题。为热爱做的网站，永远动力满满不会烂尾！

🧠知识要分板块

像办展览：入门知识、进阶内容、冷知识彩蛋、我的收藏——分好板块，游客逛起来才不会迷路。

🎪沉浸式体验

恐龙页配丛林绿+吼叫按钮、星空页配深蓝背景+闪烁动画……让游客「一秒入戏」，来了就不想走。

📸素材的来源

自己拍、自己画最好；AI生成图片（即梦、Midjourney）很方便；但别随便保存网上图片乱用——版权是创作者的底线。

🤖AI内容帮手

让AI出冷知识、设计小测验、写介绍文案：「帮我出10道恐龙趣味问答题」，兴趣页秒变互动小百科！

💡

兴趣是最好的老师：为热爱做的网站，永远不会烂尾！

🔍「恐龙世界」主题页企划书

<body class="jungle">
  <h1>🦖 恐龙世界</h1>
  <nav>
    <a href="#intro">入门</a>
    <a href="#cards">图鉴</a>
    <a href="#quiz">测验</a>
  </nav>

  <div class="dino-card">
    <h2>霸王龙</h2>
    <ul>
      <li>身高：约4米</li>
      <li>食性：肉食</li>
      <li>冷知识：前肢短到够不到嘴</li>
    </ul>
  </div>
</body>

<style>
  .jungle {
    background: linear-gradient(#14532d, #166534);
    color: #f0fdf4;
    font-family: "ZCOOL KuaiLe", sans-serif;
  }
  .dino-card {
    background: rgba(255,255,255,0.1);
    padding: 20px;
    border-radius: 16px;
  }
</style>

项目四企划书示例：

🦖 主题：恐龙世界 🎨 配色：丛林绿+大地棕

页面结构：
┌──────────────────┐
│ 🦖 恐 龙 世 界     │
├──────────────────┤
│ [入门] [图鉴] [测验]│ <-导航
├──────────────────┤
│ 霸王龙档案卡片      │
│ · 身高：4米        │
│ · 食性：肉食       │
│ · 冷知识：前肢超短 │
├──────────────────┤
│ 🎮 恐龙小测验      │
│ 恐龙灭绝于哪个纪？  │
└──────────────────┘

✨ 沉浸细节：

· 背景用丛林渐变

· 恐龙名字用「化石感」字体

· 测验答对→火山爆发动效🎉

🤖 AI分工：

冷知识→AI出

测验题→AI出

卡片布局→AI写

你→定主题+验收+埋彩蛋

为自己的热爱打工，才叫快乐的打工！

🎯小测验

第1题：做兴趣主题页时，内容的组织方式是？

第2题：「沉浸式体验」指的是？

第3题：关于网页用图，正确的做法是？

📝本课知识点

✓兴趣主题页：为热爱而做
✓内容分板块像办展览
✓沉浸式体验让人不想走
✓素材自己创作或AI生成
✓AI帮你出题写冷知识

第24课完成！继续探索下一课吧 🚀

🛠️

上一课

第23课

下一课

第25课

🛠️