热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

由空格连接或分隔的类名-Classnamesconcatenatedorseparatedbyaspace

Whendoyouseparatestyleclasseswithaspace?Soforexample:whatisthedifferencebetweenthe

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

您何时将样式类与空间分开?例如:以下两个css块之间的区别是什么?

Block 1:

块1:

div {
    color: brown;
}

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

Block 2:

第二块:

div {
    color: brown;
}

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

This is the HTML:

这是HTML:

The quick brown fox jumps over the lazy dog.

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

我试着两个版本。只有第1块文本的字体大小为18。

5 个解决方案

#1


36  

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.

当您希望引用后代元素时,您可以按空格分隔类,当您希望引用具有多个类的单个元素时,您可以将它们连接在一起。

For example, to refer to a div with two classes, e.g.

you could use:

例如,要引用具有两个类的div,例如

,您可以使用:

div.foo.bar {...}

To refer to the child span element

stuff
you could use:

参照子span元素

素材
你可以使用:

div.foo .bar {...}

#2


21  

A space indicates nesting:

空间显示嵌套:

div .foo /* .foo is inside div */

No space indicates further specificity:

没有空间表示进一步的特异性:

div.foo /* any div that is also .foo */

#3


5  

div.special refers to

div.special指

<- this

div .special refers to

div。指

<- this

Not neccassily a p BTW

当然不能

#4


2  

The space notes that this is a child item.

空间注意到这是一个子条目。

IE

div.special 

targets a div that has the class special while

目标一个有特殊的类的div。

div .special

targets an element with class special inside a div element

针对div元素中具有特殊类的元素

#5


1  

div.special will select the div element which has class .special and it wont select any other element with class .special so if you have something like

    will be excluded, where as this div .special will select all the elements having class .special which are nested inside div so this will select
      so it concludes that the 1st one is stricter than the second one

      div.special将选择的div元素类。它不会选择其他元素类。所以如果你有类似将被排除在外,而这个div。将选择所有嵌套的元素上课。在div这将选择因此得出结论,第一比第二个更严格

      So in your case either you can simply use .special or you can use div.special

      所以在你的情况下,你可以使用。special或者你可以使用div。special


推荐阅读
author-avatar
mobiledu2502872825
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有