div类中的H1无法正常工作。不知道为什么

Question

我在css中使用.section-title h1并将文本居中对齐，但是它不起作用，但是如果我仅使用h1对齐文本就可以正常工作。

<div id="section-title">
    <h1>GET IN TOUCH</h1>
    <p>Make sure to subscribe to this channel</p>
</div>

对于我尝试过的CSS

h1.section-title {
    text-align: center;
}

和

.section-title h1
{
    text-align: center;
}

Answer 1

答案：

不是使用类选择器，而是将其替换为ID选择器（＃）。

#section-title h1
{
    text-align: center;
}

Answer 2

有两种选择：

使用div类的Option1：

<div class="section-title">
    <h1>GET IN TOUCH</h1>
    <p>Make sure to subscribe to this channel</p>
</div>

.section-title h1 
{
    text-align: center;
}

或使用h1 ID的option2：

<div>
    <h1 id="section-title">GET IN TOUCH</h1>
    <p>Make sure to subscribe to this channel</p>
</div>

和

h1#section-title
{
    text-align: center;
}

Answer 3

请尝试这个

“ section-title”是H1的ID。因此，请使用“＃”代替“。”在你的CSS

h1#section-title
{
    text-align: center;
}

<div>
    <h1 id="section-title">GET IN TOUCH</h1>
    <p>Make sure to subscribe to this channel</p>
</div>