css - 如何从一个页面中排除 CSS？或者如何重置一页的页边距

Question

我来找你是为了一个看似快速的修复，但我尝试过的任何东西都没有按照我计划的方式工作。

所以我想做的是将以下 CSS 应用到我网站的所有页面，除了一个:.page-id-145。我试过在以下代码的开头使用 section:not(.page-id-145) ，但它最终弄乱了我的其他页面，同时修复了我需要的页面。我怎样才能简单地从我想要的页面中排除以下代码，而不会弄乱其他页面？我特别希望(边距和 float )在页面 ID 145 上消失。

本质上，我只需要一种方法来为这个特定页面设置边距/ float :http://www.thegrassrootsgarage.com/great-albums-rym-list/在左边，而不是在中间，这就是以下 CSS 所描述的。

这是我的主题 CSS，可能会影响相关的特定页面:

#header,
#main-content,
#wrapper-footer {
  float: none;
  height: auto;
  position: relative;
  width: 100%;        
}
#wrapper #main-content {      /* this section likely must change */
  padding: 28px 28px 10px;
  width: 720px;         
  margin: 0 auto;
  float: none;
}
#content {
  float: none;
  width: 750px;       
}

这是我之前做的另一行异常，可能会也可能不会影响它:

.page-id-145 .header-image {display: none;}

总而言之，我只是想在左侧的特定页面上开始我的边距，而不是在上面的 CSS 中指定的内容。不幸的是，我经历了各种迭代以使其像 :not 甚至 unset、inherit 和 initial 一样工作，但都无济于事。另一个可能有用的细节包括这个特定的 Wordpress 主题旨在包含侧边栏小部件 - 不确定这是否有帮助。有什么想法吗？

提前谢谢你，祝你有美好的一天。

Answer 1

如果可以，请将主题的 css 更改为:

#wrapper #main-content {
   padding: 28px 28px 10px;
   width: 720px;
}

#wrapper:not(.page-id-145) #main-content {
   margin: 0 auto;
   float: none;
}

由于 page-id-145 类应用于具有包装器 ID 的同一元素，因此您必须在该元素上指定 :not(.page-id-145)。我将样式分成两部分，第一部分将应用于#wrapper #main-content 的所有实例，而第二部分不会应用于 page-id-145。

如果您不能更改主题的 css(并且只能添加自定义 css)，那么您可以使用它来覆盖它:

#wrapper.page-id-145 #main-content {
   margin: 0; /* can also be unset or initial, whatever you prefer */
   float: /* whatever you want it to be here */;
}