「爱家居」网页设计与制作 从HTML+CSS+JavaScript到完整项目实战

一、项目背景与目标\n\n“爱家居”是一个面向年轻家庭的在线家居装饰与家具选购平台。本次「项目4」要求综合运用 HTML、CSS 与 JavaScript，完成网页从视觉设计到交互功能的完整实现。\n\n本项目的具体目标包括：\n\n- 搭建语义化的 HTML 结构，确保内容层级清晰；\n- 使用 CSS 实现响应式布局、配色方案与统一视觉风格；\n- 通过 JavaScript 添加动态轮播、筛选导航、表单验证等交互效果；\n- 形成可运行、可展示、易维护的前端项目作品集。\n\n## 二、HTML 结构设计\n\n### 2.1 页面规划\n\n站内规划 5 个核心页面：\n\n1. index.html：首页（品牌展示、特色推荐、定制服务入口）\n2. products.html：商品列表（沙发、餐桌、床品等分类）\n3. detail.html：商品详情页（大图展示、参数选项、用户评价）\n4. cart.html：购物车页（商品勾选、数量调整、总价计算）\n5. contact.html：联系我们（预约设计、留言表单）\n\n### 2.2 根据语义标签搭建骨架\n\n以下是一个与商品列表页等效的最小化示例：\n\n`html\n