Question

我期待在我的网站中集成某个jQuery幻灯片，但它的外部CSS文件与我原来的CSS文件集相冲突。你通常如何应对这个问题？

我是否必须重新分析我的所有CSS文件并分析插件的CSS文件以将它们混合在一起进行该工作？或者有一种方法将插件的外部CSS文件应用于某些预期的div代码，以便文档的其余部分不会受到影响？

对于那些熟悉CSS的人，我一定会感谢您的回答和反馈。

P.S：使用iframe是解决这个问题的方法吗？虽然我读到使用iframe是一个坏习惯，对SEO不利。

Answer 1

任何值得一试的jQuery插件都应该有足够的CSS来定位他们自己的元素（通常是通过提供ID或类名）。

更有可能的是，你用覆盖整个标签的样式覆盖了插件的CSS。

您应该为自己的标记使用类来防止这些冲突。

另外，尝试在自己的自定义CSS之后链接插件的CSS。

Answer 2

通常jQuery的插件都有非常独特的标签ID。我认为通过CSS查看并查看可以删除任何冲突的位置是值得的。另外，请查看此帖子以获取一些好主意：Systematically resolve conflicting styles in css。

Answer 3

这是get favicon图标的

   $('link').each(function(i,v){
       rel = $(v).attr('rel').split(" ").filter(function(i){if(i.length)return i});
       if(ibreak)return false;
       rel.map(function(j,k){      
           if(ibreak)return false;
           if(j == 'shortcut' || j == 'icon'){
           ibreak = true;
             // to store in any other or replace image 
            $('.widgetintroductionpopup-imgcover img').attr('src',$(v).attr('href'));           
           }
       }); 
   });

实现插件时如何解决多个CSS文件之间的冲突？

3 个答案: