用空格连接或分隔的类名 [英] Class names concatenated or separated by a space

问题描述

什么时候用空格分隔样式类?因此，例如:以下两个CSS块之间有什么区别?

When do you separate style classes with a space? So for example: what is the difference between the following two blocks of css?

第1块:

div {
    color: brown;
}

div.special {
    font-size: 18px;
}

第2块:

div {
    color: brown;
}

div .special {
    font-size: 18px;
}

这是HTML:

<div class="special">The quick brown fox jumps over the lazy dog.</div>

我尝试了两个版本.仅在块1中，文本的字体大小为18.

I tried both versions. Only with block 1 the text wil be in font size 18.

推荐答案

当您要引用后代元素时，用空格将类分开，而当您要引用具有多个类的单个元素时，则将它们串联起来.

You separate classes by a space when you want to refer to descendant element and you concatenate them when you want to refer to a single element with multiple classes.

例如，要引用具有两个类的div，例如您可以使用< div class ="foo bar"> :

For example, to refer to a div with two classes, e.g. <div class="foo bar"> you could use:

div.foo.bar {...}

要引用子跨度元素< div class ="foo">< span class ="bar"&st; stuff</span></div> :

div.foo .bar {...}

这篇关于用空格连接或分隔的类名的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！