目前，我正在尝试使用此w3school教程中显示的幻灯片编写网站代码：https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_slideshow_auto
如图所示的示例有自己的CSS集，可以使幻灯片的过渡和效果平滑淡入淡出。添加CSS bootstrap后，幻灯片的效果变得粗糙，转换不再平滑。
使用的CSS：https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css
我在我的css文件之前将它链接到这样：
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" type="text/css">
接着是
<link rel="stylesheet" href="css.css" type="text/css">
从我之前搜索过的例子中，很多人说我在我自己的css文件之前放入bootstrap，这样我自己的代码就不会被覆盖。但我已经尝试过，但在这种情况下它不起作用。任何人都可以告诉我这个吗？谢谢。
答案 0 :(得分：0)
尝试将!important添加到您不希望受到影响的CSS规则中。
尝试使用浏览器的检查工具查看适用于每个元素的CSS规则
答案 1 :(得分：0)
您需要命名幻灯片中使用的类名称，以便它不受引导样式的影响。在类名重写的情况下，很难处理bootstrap特性。
我的建议是使用w3_slideshow_之类的东西，并在其前面添加所有类名。 class="text"将变为class="w3_slideshow_text"等。然后相应地更新样式和js。
如果仍有一些问题，请检查检查员的特异性，并使用!important（不是最干净的方法）或应用更具体的选择器来覆盖引导程序应用的样式。
答案 2 :(得分：0)
正如Giann Dall所说，您可以尝试添加body > p {}
我认为你的CSS属性可能会被CSS从bootstrap覆盖，因为它更具体。 例如：
p {}
比
更具体body > p {}因此，In [10]: df
Out[10]:
OwnerID Value
0 1 A
1 1 B
2 1 C
3 1 D
4 2 X
5 2 Y
6 2 Z
被应用