css - 在 CSS 中想出一个独特的选择器有问题

Question

我正在尝试使用 CSS 摆脱“订阅”标题。

我检查它，然后使用以下代码将其删除，它工作正常：

#main-outlet.wrap .container .title-wrapper h1 {
    display: none;
} 

但是，碰巧我网站中的其他元素使用相同的选择器，因此它也将它们删除。特别是，它删除了我主页上主题讨论的标题。但我不知道如何解决这个问题，因为似乎没有更具体的选择器用于特别是“订阅”的页面。我错过了什么？

标签： css

Answer 1

你需要隔离你的<h1>元素。

我猜你不能直接编辑 HTML，否则你可以为class元素添加一个唯一的。

您仍然可以通过一个简短的脚本在计算上隔离元素。

有很多方法，但这里有两种：

方法一

用两行javascript就可以达到你需要的效果。

Javascript

const mainHeading = document.getElementsByTagName('h1')[0];
mainHeading.style.setProperty('opacity', 0);

---

方法二

或者，更复杂一点，两行 javascript 和一行 CSS。

Javascript

const mainHeading = document.getElementsByTagName('h1')[0];
mainHeading.classList.add('subscribeMainHeading');

CSS

.subscribeMainHeading {
  opacity: 0;
}