Css 以不同的方式将h1与h6在DIV中对齐

我有以下CSS

.align-headers-desktop-left h1, h2, h3, h4, h5, h6 {
    text-align: left;
    color: red;
}

.align-headers-desktop-right h1, h2, h3, h4, h5, h6 {
    text-align: right;
    color: red;
}

.align-headers-desktop-centre h1, h2, h3, h4, h5, h6 {
    text-align: center;
    color: red;
}

.align-headers-desktop-justify h1, h2, h3, h4, h5, h6 {
    text-align: justify;
    color: red;
}

在第一个div中，收割台将正确对齐，问题是在下一个div中，收割台将与第一个div的对齐方式一致

我试过使用

！重要信息

，但这不起作用，我尝试将div添加到类的前面，但不起作用

案文如下

<div class="align-headers-desktop-right">
    <h1>H1</h1>
</div>

div.align-headers-desktop-left h1, div.align-headers-desktop-left h2, div.align-headers-desktop-left h3, div.align-headers-desktop-left h4, div.align-headers-desktop-left h5, div.align-headers-desktop-left h6 {
        text-align: left;
        color: red;
    }
    div.align-headers-desktop-right h1, div.align-headers-desktop-right h2, div.align-headers-desktop-right h3, div.align-headers-desktop-right h4, div.align-headers-desktop-right h5, div.align-headers-desktop-right h6 {
        text-align: right;
        color: red;
    }
    div.align-headers-desktop-centre h1, div.align-headers-desktop-centre h2, div.align-headers-desktop-centre h3, div.align-headers-desktop-centre h4, div.align-headers-desktop-centre h5, div.align-headers-desktop-centre h6 {
        text-align: center;
        color: red;
    }
    div.align-headers-desktop-justify h1, div.align-headers-desktop-justify h2, div.align-headers-desktop-justify h3, div.align-headers-desktop-justify h4, div.align-headers-desktop-justify h5, div.align-headers-desktop-justify h6 {
        text-align: justify;
        color: red;
    }

H1

---

任何帮助都将不胜感激。

这是漫长的一天，CSS应该如下所示

<div class="align-headers-desktop-right">
    <h1>H1</h1>
</div>

div.align-headers-desktop-left h1, div.align-headers-desktop-left h2, div.align-headers-desktop-left h3, div.align-headers-desktop-left h4, div.align-headers-desktop-left h5, div.align-headers-desktop-left h6 {
        text-align: left;
        color: red;
    }
    div.align-headers-desktop-right h1, div.align-headers-desktop-right h2, div.align-headers-desktop-right h3, div.align-headers-desktop-right h4, div.align-headers-desktop-right h5, div.align-headers-desktop-right h6 {
        text-align: right;
        color: red;
    }
    div.align-headers-desktop-centre h1, div.align-headers-desktop-centre h2, div.align-headers-desktop-centre h3, div.align-headers-desktop-centre h4, div.align-headers-desktop-centre h5, div.align-headers-desktop-centre h6 {
        text-align: center;
        color: red;
    }
    div.align-headers-desktop-justify h1, div.align-headers-desktop-justify h2, div.align-headers-desktop-justify h3, div.align-headers-desktop-justify h4, div.align-headers-desktop-justify h5, div.align-headers-desktop-justify h6 {
        text-align: justify;
        color: red;
    }

---

以下是一个工作示例：

.align headers desktop left h1，
.将标题左对齐h2，
.将标题左对齐h3，
.将标题与桌面左侧对齐h4，
.左对齐页眉h5，
.将标题与桌面左侧对齐h6{
文本对齐：左对齐；
颜色：红色；
}
.右对齐桌面标题h1，
.将标题与桌面右对齐h2，
.将标题与桌面右对齐h3，
.将标题与桌面右侧对齐h4，
.将标题与桌面右侧对齐h5，
.右对齐桌面标题h6{
文本对齐：右对齐；
颜色：红色；
}
.将标题对齐桌面中心h1，
.将标题对齐桌面中心h2，
.将标题对准桌面中心h3，
.对齐收割台桌面中心h4，
.将标题对准桌面中心h5，
.将标题与桌面中心对齐h6{
文本对齐：居中；
颜色：红色；
}
.将页眉与页眉对齐，
.将页眉与页眉对齐，
.将标题对齐至h3，
.将标题与h4对齐，
.将标题对齐至h5，
.将标题对齐到h6{
文本对齐：对齐；
颜色：红色；
}

H1
氢
H3
H4
H5
H6
H1
氢
H3
H4
H5
H6
H1
氢
H3
H4
H5
H6
H1
氢
H3
H4
H5
H6

Mihai T Temani Af如果这个问题是重复的，请告诉我在问题的哪里我问了逗号和空格的意思！！！！！如果你仔细看一下，我在贴出自己的问题大约10分钟后，当我意识到我的错误是什么时，我回答了自己的问题。这是最近出现的问题之一，人们很快就会把人记下来，或者把问题记为重复问题