如何使用class =“name1 name2”引用div?

时间:2011-08-11 13:04:52

标签: css css-selectors

我正在从教程中学习一些CSS,div有这个类:

<div class="related products">

如何在样式表中引用它?

4 个答案:

答案 0 :(得分:19)

div实际上有两个类relatedproducts。您可以使用.related.products在样式表中引用它,它将从这两个规则中选择样式。例如,使用以下CSS,问题中div中的文字将显示为红色,字体大小为12:

.related { color:#ff0000 }
.products { font-size:12px }

如果要选择包含两个类的元素,请在样式表中使用.related.products。例如,将以下内容添加到上面的示例中:

.related.products { font-weight:bold }

div中的文字将收到所有三条规则,因为它匹配所有3个选择器。这是一个有效的example

答案 1 :(得分:4)

div.related.products是一般方法

答案 2 :(得分:2)

您可以通过div.related.products来引用它,该文字可以翻译为“a div,其中包含相关类别和产品类别。”

或者,你可以使用 类名来引用它,因为它会同时捕获它们。

jsFiddle Example

答案 3 :(得分:-4)

在css中,只需输入div的名称类:

.related products {
/*styling to go here*/
}

现在相关产品类中的任何样式都将应用于该div。