Question

如何从网址中包含.tm-navbar:before的所有网页（例如https://example.com/event/more）以及以下网页中删除CSS类/event/：

/agb
/wiederrufsbelehrung
/impressum

解决方案应该只删除.tm-navbar:before而不是.tm-navbar。

Answer 1

您可以使用JS来执行此操作：

if(window.location.pathname.indexof('/event/') > -1) {
    $('.tm-navbar').addClass('dontUseCss');
}

然后在你的CSS中你可以做这样的事情：

.tm-navbar:not(.dontUseCss):before { ... }

Answer 2

解决方案是评论中陈述的各种内容。我用它作为我的方法的模板： https://stackoverflow.com/a/19355623/8207054

并改变了添加CSS的方式。它现在将CSS添加到网站的HTML标记中，以便我可以执行下面发布的CSS。

 switch(window.location.pathname){
          case "/impressum":  $("html").addClass("no-gradient"); break;
          case "/agb":  $("html").addClass("no-gradient"); break;
          case "/datenschutz":  $("html").addClass("no-gradient"); break;
          case "/event/more0":  $("html").addClass("no-gradient"); break;
          case "/event/more1":  $("html").addClass("no-gradient"); break;
          case "/event/more2":  $("html").addClass("no-gradient"); break;
          case "/event/more3":  $("html").addClass("no-gradient"); break;
          case "/event/more4":  $("html").addClass("no-gradient"); break;
          case "/event/more5":  $("html").addClass("no-gradient"); break;
          case "/event/more6":  $("html").addClass("no-gradient"); break;
       }

CSS：

body > html.no-gradient > div.tm-navbar::before {
background: transparent !important;
display: none !important;
}


.no-gradient .tm-navbar:before {
background: transparent !important;
display: none !important;
}

它删除了添加到导航栏中的渐变以获得更好的可读性，但由于JS中定义的页面没有透明的英雄标题，因此不需要它们。这就是为什么我需要修复它。

感谢@MikeMcCaughan，@ devius和@jdmdevdotnet的想法和帮助解决我的问题：）

如何删除特定页面上的CSS类？

2 个答案: