我可以在CSS中一起使用DIV类和ID吗？

Can I use DIV Class and ID together in CSS? For example:

我可以在CSS中一起使用DIV类和ID吗？例如：

<div class="x" id="y">
    --
</div>

9 个解决方案

#1

Yes, yes you can.

是的，是的，你可以。

#y.x {
 /* will select element of id="y" that also has class="x" */
}

Similarly:

同理：

.x#y {
 /* will select elements of class="x" that also have an id="y" */
}

Incidentally this might be useful in some use cases (wherein classes are used to represent some form of event or interaction), but for the most part it's not necessarily that useful, since ids are unique in the document anyway. But if you're using classes for user-interaction then it can be useful to know.

顺便提一下，这可能在某些用例中很有用（其中类用于表示某种形式的事件或交互），但在大多数情况下它并不一定有用，因为ids在文档中无论如何都是唯一的。但是，如果您使用类进行用户交互，那么了解它会很有用。

#2

You can also use as many classes as needed on a tag, but an id must be unique to the document. Also be careful of using too many divs, when another more semantic tag can do the job.

您还可以根据需要在标记上使用尽可能多的类，但id必须对文档是唯一的。当另一个更多的语义标签可以完成这项工作时，也要小心使用太多的div。

<p id="unique" class="x y z">Styled paragraph</p>

#3

Of course you can.

当然可以。

Your HTML there is just fine. To style the elements with css you can use the following approaches:

你的HTML就好了。要使用css为元素设置样式，可以使用以下方法：

#y {
    ...
}

.x {
    ...
}

#y.x {
    ...
}

Also you can add as many classes as you wish to your element

您还可以根据需要为元素添加任意数量的类

<div id="id" class="classA classB classC ...">
</div>

And you can style that element using a selector with any combination of the classes and id. For example:

您可以使用带有类和id的任意组合的选择器来设置该元素的样式。例如：

#id.classA.classB.classC {
     ...
}

#id.classC {
}

#4

That's HTML, but yes, you can bang pretty much any selectors you like together.

这是HTML，但是是的，你可以在任何你喜欢的选择器上碰到很多。

#x.y { }

(And the HTML is fine too)

（而且HTML也很好）

#5

Yes, in one single division you can use both but it's not very common. While styling you will call both so it will cause some ambiguity if you don't properly choose "x" and "y". Use # for ID and . for class. And for overall division you will either do separate styling or write: #x .y for styling purposes.

是的，在一个单独的部门中你可以使用两者，但这并不常见。虽然造型你会同时调用它们，但如果你没有正确地选择“x”和“y”，它会引起一些歧义。使用＃作为ID和。上课。对于整体划分，你要么做单独的造型，要么写：#x .y用于造型。

#6

Yes, why not? Then CSS that applies to class "x" AND CSS that applies to ID "y" applies to the div.

是的，为什么不？然后适用于类“x”的CSS和适用于ID“y”的CSS适用于div。

#7

If you want to target a specific class and ID in CSS, then use a format like div.x#y {}.

如果要在CSS中定位特定的类和ID，请使用div.x＃y {}等格式。

#8

#y.x should work. And it's convenient too. You can make a page with different kinds of output. You can give a certain element an id, but give it different classes depending on the look you want.

#y.x应该有效。它也很方便。您可以创建具有不同类型输出的页面。你可以给某个元素一个id，但根据你想要的外观给它不同的类。

#9

Yes you can.

是的你可以。

You just need to understand what they are for, the class is more general and can be used several times, the id (is like your id's) you can use it only once.

你只需要了解它们的用途，该类更通用，可以多次使用，id（就像你的id一样）你只能使用它一次。

This excellent tutorial helped me with that:

这个优秀的教程帮助我：

The Difference Between ID and Class

ID和类之间的区别

Though it's not an exact answer to your question I'm sure it will help you a lot!

虽然这不是你问题的确切答案，但我相信它会对你有很大的帮助！

Good luck!

祝你好运！

EDIT: Reading your question, I just want to clarify that:

编辑：阅读你的问题，我只是想澄清一下：

<div class="x" id="y">
    --
</div>

And that if you want to "use them" in CSS for styling purposes you should do as David Says: #x.y { }

如果你想在CSS中“使用它们”进行样式设计，你应该像David说的那样：＃x.y {}

#1