解决引⽤bootstrap样式时遇到的冲突问题
1、引⽤bootdtrap.css时遇到的样式冲突问题：
因为html渲染的时候是⾃上⽽下的，后⾯的样式会覆盖前⾯的样式。
所以如果你的css样式不能覆盖bootstrap的样式，检查⼀下是不是⾃⼰的样式的引⼊放在了bootstrap的引⼊前⾯。
正确的是把⾃⼰的样式引⼊放在bootstrap的引⼊后⾯。
⽐如：
<link rel="stylesheet" type="text/css" href="bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="mine.css"> //这是我的
2、如何禁⽤bootstrap的响应：
PC端web就打算使⽤Bootstrap来进⾏开发，但是⼜想去掉Bootstrap的响应式效果
1.移除标签
禁⽤响应式布局的第⼀步买就是移除在head标签中添加的meta标签，如下所⽰：
<meta name="viewport" content="width=device-width, initial-scale=1.0”>
对这个标签做⼀个简单的解释，这个标签的作⽤在于使得你的⽹站在移动设备端访问的时候，不会进⾏缩放，⽽是以100%的⽐例显⽰在移动设备中。
2.设置container类的宽度
禁⽤的第⼆步是为.container类设置⼀个宽度，从⽽覆盖它根据设备宽度⽽⾃动调节的功能，⽹上到的教程普遍只对container类设置⼀个宽度，这⾥我们给container设置⼀个最⼤宽度为none，并且全部设置为!important，保证能覆盖原来的Bootstrap样式，如下所⽰：
.container {
width: 1200px !important;
max-width: none !important;
}
bootstrap3菜鸟教程
3.删除折叠菜单
倘若你采⽤了导航栏，那么就要注意删掉菜单在移动端的折叠样展开式（主要通过button的navbar-toggle来实现）。
4.栅栏布局
除此之外，如果你采⽤了栅格布局，那么就要采⽤.col-xs-（最⼩设备栅格类）的样式来代替.col-md-以及.col-lg-*，这样就能确保栅格能够在所有设备中展开。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。