Question

此代码有效，但我怀疑它不是应该写的方式：

.srtbl-qt  {
    text-align: left;
}

 caption { text-align: left;
}

我试着像这样写它但它不起作用

.srtbl-qt caption {
    text-align: left;
}

写出来的好方法是什么？

Answer 1

喜欢这个吗？

.srtbl-qt,
caption  {
    text-align: left;
}

Answer 2

您可以使用逗号连接多个选择器：

.srtbl-qt, caption 
{
    text-align: left;
}

Answer 3

通过使用逗号连接它们来尝试这样：

.srtbl-qt,caption  {
    text-align: left;
}

请注意，CSS选择器中的逗号用于分隔具有相同样式的多个选择器

Answer 4

或者，您可以将.css文件视为可以重用类的库。通过创建一个类，例如＆＃39; .left＆＃39;在此示例中，您可以在两个需要文本对齐的html标记中应用此类。

styles.css的

.left {
text-align: left;
}

page.html中

<body>
<p class="left">paragraph</p>
<img src="picture.jpg" class="left" />
<section class="left otherClass">This is a section</section>
</body>

CSS专为RE-USE设计，因此重用类可以实现相同的功能，而不是使用不同的名称编写。每个标记可以有许多类，最后出现的类将覆盖类中具有冲突（相同样式）的任何类。

Answer 5

使用逗号分隔选择器：

.srtbl-qt, caption {
    text-align: left;
}

Answer 6

.srtbl-qt, caption {
    text-align: left;
}

减少行数，并给出相同的结果。所以我认为这是最有效的方式。