CSS类嵌套不起作用

Question

我有一个CSS类，并且我想确保每当将h2标签分配给该类时，就会在原始类的顶部为h2标签提供附加的CSS。这是我目前在CSS和HTML上拥有的东西，但目前没有呈现出text-align类。

.aligncenter {
	clear: both;
	color: #000000
	h2{
		text-align: center;
	}

<div>
<h2 class="aligncenter"> H2 Text that should be black and centered</h2>
</div>

Answer 1

您不能使用常规CSS来做到这一点。用常规的CSS实现您想要的唯一方法是这样的：

.aligncenter {
    clear: both;
    color: #000000
}

h2.aligncenter {
    clear: both;
    color: #000000
    text-align: center;
}

要进行嵌套和其他有趣的工作，您需要一些CSS扩展语言，例如SASS

Answer 2

.aligncenter {
	clear: both;
	color: #000000
	h2{
		text-align: center;
	}

<div>
<h2 class="aligncenter"> H2 Text that should be black and centered</h2>
</div>

Answer 3

<style>
h2.aligncenter {
        clear: both;
        color: #000000;
        text-align: center;
        }
</style>

    <div><h2 class="aligncenter"> H2 Text that should be black and centered</h2></div>
 <!-- end snippet -->