Question

我在文章元素中有一个H1。

我的h1的样式是这样的：

*:not(article) h1 {
}

但是，我只想在H1不在文章中时应用这种样式。我认为这对CSS来说是一个简单的补充：

<meta charset="UTF-8">

然而，这对我来说似乎没有用，我一直在摸不着头脑。可能吗？我的语法合适吗？ CSS中还有潜伏的东西吗？

任何帮助表示感谢。

Answer 1

是的，您可以使用：

h1 {
    color:blue;
    margin-bottom:2.4rem;
    padding-bottom:0.7rem;  
}

:not(article) > h1{ 
   color: green
}

http://codepen.io/anon/pen/zvKKqE?editors=110

Answer 2

你有没有尝试过老式的方式＆＃39;

.article h1{ /* insert styling for h1 inside article */ }

h1 { /* insert styling for h1 outside article */}

请注意.article h1从h1获取所有元素。因此，请确保覆盖不同的样式（例如，使用！important）。

- EDIT--
如果你想使用：not（）我不能看到你的代码行有问题。 HTML如何？我在JSFiddle中得到了这个例子：
https://jsfiddle.net/2aruu0Lr/1/

如果没有h1的父标记，它就不起作用，如果有一个像<span>或者在我的情况下是<strong>的话，它就会起作用希望这能帮到你！

解决方案：

body *：not（article）h1

Answer 3

这对你有用吗？

@primaryText: #000000;
@divider: lime;
.display1 {
    padding: 15px;
}

h1 {
    &:extend(.display1);

    :not(article) > & {

        border-bottom:solid 0.1rem @divider;
        color:@primaryText;
        margin-bottom:2.4rem;
        padding-bottom:0.7rem;

    }
}

输出：

.display1,
h1 {
  padding: 15px;
}
:not(article) > h1 {
  border-bottom: solid 0.1rem lime;
  color: #000000;
  margin-bottom: 2.4rem;
  padding-bottom: 0.7rem;
}

简单的CSS但不起作用

3 个答案: