Bootstrap不是婚庆网站生成器，直接套用官方模板易出错；需手动配置轮播图、弹窗、表单等依赖，修正HTML结构、路径引用及图片加载策略。
Bootstrap 本身不是婚庆网站生成器，它只是前端框架；直接套用官方示例或免费模板大概率会翻车——图片错位、手机端轮播卡死、表单提交后无响应，这些不是设计问题，是配置和集成没做对。
为什么直接用 Bootstrap 官方 Starter Template 会出问题
官方 starter-template 默认不带 jQuery、Popper 或表单验证逻辑，而婚庆站高频依赖：carousel（轮播图）、modal（预约弹窗）、form-control（联系表单）。缺任意一项，首页大图就静止不动，点击“立即咨询”没反应。
- Bootstrap 5+ 已移除 jQuery 依赖，但很多现成的相册插件（如
lightGallery）仍需手动引入jQuery和bootstrap.bundle.min.js，顺序错了就报TypeError: bootstrap is not defined -
carousel默认不自动循环，婚庆图集需要加data-bs-ride="carousel"+data-bs-interval="4000" - 手机端导航栏（
navbar-toggler）如果漏掉data-bs-toggle="collapse"，点菜单图标毫无反应
必须改写的三个核心 HTML 片段
别碰整套 CSS 重写，聚焦三处：轮播图、服务卡片、联系表单。其他用 container + row + col 布局即可。
- 轮播图容器必须加
class="carousel slide"，且每个.carousel-item内首张图要加active类，否则第一张不显示 - 服务卡片用
card border-0 shadow-sm，去掉默认边框和阴影太淡，客户看不出“高端感”；标题用h5 card-title，别用h3，否则 SEO 权重被首页标题稀释 - 联系表单的
input必须有name属性（如name="client_name"），否则后端 PHP/Node 接不到数据；提交按钮加type="submit"，别写成button
表单提交失败？检查这四件事
90% 的“点提交没反应”不是 JS 错误，是路径或权限问题。
- 确认
form的action指向真实存在的后端脚本，比如action="send_mail.php"，而不是action="#"或空值 -
send_mail.php文件必须放在同级目录，且服务器已启用mail()函数（虚拟主机常默认禁用，得改用 SMTP） - 所有
input字段加required属性，否则用户可空提交，后端收不到字段就静默失败 - 如果用 AJAX 提交，确保
fetch或$.post的 URL 路径正确，且响应头含Content-Type: application/json，否则前端解析response.json()报错
图片加载慢、首屏白屏？别只压缩 JPG
婚庆图多为高分辨率 JPG，但 img 标签没做懒加载或格式降级，用户 3G 网络下等 8 秒才出首图。
- 把主图转成
webp格式（用cwebp命令行工具），体积比 JPG 小 40%，浏览器兼容性够用（Chrome/Firefox/Safari 14+ 都支持） - 所有
img加loading="lazy"，但首页首张大图（carousel-item active内）必须删掉该属性，否则可能不加载 - 用
srcset提供多尺寸：比如srcset="hero-800w.webp 800w, hero-1200w.webp 1200w"，配合sizes="(max-width: 768px) 100vw, 50vw"
col-md-4 堆服务项，bg-light 分隔区块，足够清晰。细节上，carousel 的 data-bs-pause="hover" 别关掉——客户鼠标停在照片上想细看，暂停是基本尊重。 
