做了什么用HTML、CSS、JavaScript做了一个个人博客网站有5个页面首页、关于我、项目作品、技术博客、联系我。页面之间可以来回切换首页有轮播图项目卡片点击能打开我之前做的练习项目。怎么做的结构每个页面都有相同的导航栏用nav标签包起来页面内容放在div classcontainer里。样式用CSS变量统一颜色flex和grid布局让内容居中、卡片排列整齐。轮播图用JavaScript控制transform: translateX切换图片setInterval每4秒自动下一张。响应式手机屏幕上导航栏变成竖着排列轮播图高度变小。踩过的坑1. 图片加载不出来外网占位图被墙换成纯色块做卡片头部好看又稳定。2. GitHub推送超时学校网限制改用SSH走443端口解决。3. 手机端布局乱加一行media (max-width: 768px)让导航栏竖排问题解决。代码片段 css /* 统一颜色 */ :root { --primary: #2c3e50; --accent: #3498db; } /* 轮播图切换 */ function showSlide(index) { carouselInner.style.transform translateX(-${index * 100}%); }总结做完这个博客把课堂上学的HTML、CSS、JS连在了一起也学会了怎么用GitHub Pages把网站免费上线。整个过程写代码、查文档、调bug收获很多。
