Question

我需要在除Wordpress Twenty Sixteen主题中的主页之外的所有页面上将标头应用于标头。目前我手动这样做：

.page-id-24 #masthead {
padding: 5%;
background-image: url(...);
background-size: 1400px 500px;
height: 10px;
margin-bottom: 5%;
}

.page-id-14 #masthead {
padding: 5%;
background-image: url(...);
background-size: 1400px 500px;
height: 10px;
margin-bottom: 5%;
}

我有什么方法可以写#masthead not:(home) {...}这样的内容来大幅加快流程并更改除主页之外的所有页面上的标头。

谢谢，

杰克

Answer 1

欢迎使用StackExchange！

你提到的好事＆＃34; Twenty Sixteen＆＃34;作为你的主题。我能够在wordpress.org上提取你的主题演示，并为你的目的找出一个可接受的选择器。请参考以下内容：

body:not(.home) #masthead { /* Stylish */}

这个选择器应该适合你。

http://codepen.io/anon/pen/LZGmLV

：not（）选择器的工作方式是它被视为伪类，可以接受一个简单的选择器来否定。在我们的情况下，我们正在寻找一个元素（更具体地说，您的<header>元素）与＃34;标头＆＃34;仅在主页上显示的ID。此外，我们还使用此选择器从我们的风格排除。

建议进一步阅读：

https://developer.mozilla.org/en-US/docs/Web/CSS/:not

仅将CSS应用于一个页面

1 个答案: