[分享]css两个类名写在一起

在CSS中，我们经常会看到不同的类名写在一起，例如： .class1.class2{ // CSS样式 } 这种写法叫做“类名选择器的组合”。它的作用是选择同时拥有class1和class2类名的元素...

在CSS中，我们经常会看到不同的类名写在一起，例如：

 .class1.class2{
        // CSS样式
    } 

这种写法叫做“类名选择器的组合”。它的作用是选择同时拥有class1和class2类名的元素，即两个类名都存在时才生效。

这种写法实际上可以看做是两个类名选择器的并集，即：

 .class1{
        // CSS样式
    }
    
    .class2{
        // CSS样式
    } 

这两个样式分别作用于具有class1和class2类名的元素，它们的效果相当于是交集。

类名选择器的组合不仅可以用于CSS的样式表中，还可以用于JavaScript中的DOM操作，比如获取同时拥有多个类名的元素：

 var elements = document.querySelectorAll(".class1.class2"); 

这样就可以获取同时具有class1和class2的元素集合了。

总之，类名选择器的组合是CSS的一个非常有用的特性，它能够帮助我们更灵活地选择元素，并将它们作为一个整体进行样式设置、事件绑定等操作。