style.css与bootstrap.css样式冲突导致网站无法正常运行求助

• 调整样式引入顺序：把你的style.css放在Bootstrap CSS文件之后引入，这样自定义样式会默认覆盖Bootstrap的同名类样式（如果Bootstrap样式加了!important，需要针对性处理）。
• 给自定义类加专属命名空间：给所有自定义样式的类名添加独特前缀，比如site-或custom-，比如把button改成site-button，card改成custom-card，从根源避免类名重复。
• 提升自定义样式优先级：
  • 给选择器增加上下文限定，比如用父元素的类来缩小范围，写成.page-header .custom-title而不是.custom-title
  • 必要时使用!important标记（尽量少用，避免后续样式维护混乱）
• 启用CSS Modules（模块化项目适用）：如果是React、Vue这类模块化项目，开启CSS Modules功能，它会自动给类名添加唯一哈希后缀，彻底杜绝类名冲突。
• 定位冲突类名并修改：打开浏览器开发者工具（F12），查看异常元素的样式面板，找到被冲突覆盖的具体类名，直接修改自定义样式中的对应类名。
• 自定义构建Bootstrap：通过Bootstrap的自定义构建功能，只引入你需要的组件样式，还可以修改Bootstrap默认类名的前缀（比如把btn改为bs-btn），减少冲突可能性。

内容的提问来源于stack exchange，提问作者Ramadan Hasani