时间戳

首页 > 解决方案 > 为什么 Bootstrap 会破坏我的正常 CSS 布局，我该如何解决？

javascript - 为什么 Bootstrap 会破坏我的正常 CSS 布局，我该如何解决？

问题描述

首先请原谅我的语言，这是我的第三语言，我是新手。

我想做一个不需要响应式的带有 html、css 和引导程序的小网站。所以我做了一个带有 javascript 和 css 的粘性导航栏，看起来不错。因为我想使用 ajax（因为不必在每个 html 文件上编写导航栏）和 Bootstrap（对于某些按钮、模式等）

所以我在我的 html-doc 中添加了 Bootstrap，现在我的整个导航栏的风格不同了。它甚至不再粘，底部有一个奇怪的白色边框。

如果你能帮助我，那就太好了。

我正在使用括号，所以所有这些东西都是本地的，我不打算用它制作一个真正的网站。

祝大家圣诞快乐！
巴斯蒂

标签： javascripthtmlcsstwitter-bootstrapbootstrap-4

解决方案

为什么？

您的 css 声明已被引导程序声明覆盖：

例如，我尝试设置color:red但看看发生了什么：

在此处输入图像描述

你必须使用这个步骤来最小化你的 css 和 bootstrap css 之间的冲突：

  • 在引导链接下方设置您的 css 链接

    <link href="css/bootstrap.min.css" rel="stylesheet"> <link href="yourCss.css" rel="stylesheet">

  • 使用css中的Specificityid作为自己的或class

    特异性是浏览器决定哪些 CSS 属性值与元素最相关并因此将被应用的方法。特异性基于由不同种类的 CSS 选择器组成的匹配规则。

  • 如果您的 css 声明已覆盖使用!important

    例如color:red!important

推荐阅读