现代化HTML模板（适配个人博客/技术站，蓝紫科技调+轻量化交互）

基于原模板优化，强化博客/技术展示属性，新增「博主介绍、文章推荐、留言板块」，简化企业化模块，配色调整为蓝紫渐变科技风，保留全响应式+顺滑动画，代码可直接运行、一键修改。

定制化亮点（适配个人技术博客/开发者站）

1. 场景专属模块：删除企业化的「统计、案例」，新增博主介绍、最新文章、留言板块（博客核心），贴合开发者使用场景；

​

2. 配色升级：蓝紫渐变科技风，适配技术站调性，可通过 :root 里的 –primary/–secondary 一键修改全站配色；

​

3. 交互优化：强化卡片hover动效、导航滚动收缩、平滑锚点滚动，保留轻量化无冗余；

​

4. 内容贴合：文章板块加入「标签、阅读量、发布时间」，博主介绍加入「身份标签、社交入口」，完全匹配技术博客需求；

​

5. 保留全响应式：移动端自动适配，汉堡菜单、单列布局，手机端体验流畅。

快速修改指南

1. 替换信息：直接修改文字/图片链接即可（头像、文章图、博主介绍、备案号等）；

​

2. 修改配色：在 style 的 :root 中，修改 –primary （主色）、 –secondary （辅色），全站配色自动同步；

​

3. 新增文章：复制 <div class=”article-card”>…</div> 即可新增文章卡片，样式自动统一；

​

4. 修改功能：如需增加「分类导航、文章归档」，可复用现有 nav/ul 样式，直接新增即可。