html - 防止 twitter bootstrap 更改现有元素样式

标签 html css twitter-bootstrap

我有一个包含大量 CSS 的复杂网站,包括 jQuery UI 等等。

我已经添加了 twitter bootstrap 3(目前最新的),我想用它来将单个链接设置为按钮样式。

好吧,我得到了按钮,这太棒了!

而且,不知何故,我的字段集的 <legend>元素有了不同的样式,我现有的菜单突然开始使用更大的字体大小,弄乱了我现有的布局。

因此,我的印象是添加 Twitter Bootstrap 会扰乱您现有的组件,无论您喜不喜欢。我不确定它是否总是这样做,或者它是否是我现有的 CSS 和 Bootstrap 之间的复杂交互。

我的问题:如何限制 bootstrap 仅对我的单个按钮进行样式设置(而让其余按钮单独设置)?这可能吗?

我的代码是:

<link rel="stylesheet" href="bootstrap.css" type="text/css" media="screen" />
 .....
<fieldset>

    <!-- somehow the legend text below changed from existing pre-bootstrap styling -->
    <legend>Menu Selection</legend> 
    <table>
 .....
<a href="#" class="btn btn-default btn-info btn-lg">
    <span class="glyphicon glyphicon-cog"></span>
button</a>

最佳答案

为什么不复制 Button 样式并将其包含在 custom.css 中并忽略 Bootstrap.css。

我认为包含一个大型框架只是为了设置按钮/链接的样式不是个好主意吗?

或者,使用 Bootstrap 定制器下载您“想要”使用的部分。

此外,您还可以通过分区创建不同版本的 Bootstrap.css 文件。

这是一张图片。

enter image description here

关于html - 防止 twitter bootstrap 更改现有元素样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23920078/

相关文章:

javascript - 测试浏览器是否支持未静音播放内联视频

html - 当我缩小浏览器时,我应该如何修改我的 css 以使图像更接近我的文本?

html - 使用 nokogiri 抓取后字符串的正则表达式是什么

jquery - Bootstrap 4 下拉菜单出现在其他元素后面

html - 如何保存带有嵌入图像的网页

javascript - 用 Javascript 开发 Canvas 游戏是否需要框架?

javascript - Bootstrap 导航栏中的链接

javascript - 在 Y 屏幕位置显示 CSS 动画

css - Bootstrap - 如何设置中间列元素以在移动设备和浏览器折叠时呈现全宽

twitter-bootstrap - Bootstrap 5.1.3 Dropdown data-bs-boundary 不再有效