CSS 通用和分组选择器(十)

一、通用选择器

通用选择器可能是所有选择器中最强大的，却使用最少的。通用选择器的作用就像是通配符，它匹配所有可用元素。通用选择器由一个星号表示。通用选择器一般用来对象页面上所有元素应用样式

例如：可使用，以下规则删除第个元素上的默认的空白边界

*{margin:0;
padding:0;
}

 

二、分组选择器

分组选择器不是一种选择器类型，而是一种选择器使用方法。当多个对象定义了相同的样式时，就可以把它们分成一组，这样能够简化代码。

/*定义所有级别的标题和段落行高为22px*/
h1,h2,h3,h4,h5,h6,p{
    line-height:22px;
}

分组选择器，可以使用逗号把同组内不同对象分隔。分组选择器与类选择器在性质上有点类似，都可以为不同元素或者对象定义相同的样式。

将以下样式改变

.class1{
    font-size:13px;
    color:red;
    text-decoration:underline;
    }
.class2{
    font-size:13px;
    color:blue;
    text-decoration:underline;
    }

分组选择器使用

.class1{
    color:red;
    }
.class2{
    color:blue;
    }
    /*共同样式*/
.class1,class2{
    font-size:13px;
    text-decoration:underline;
    }

分组选择器坚持以下两个原则

• 方便原则。不能为了分组而分组，如把每个元素、对象中具有相同的声明都抽取出来分为一组，只能给自己带来麻烦。此时定义一个类会理更方便
• 就近原则。如果几个元素相邻，并同处在同一个模块内，可以考虑把相同声明提取出来进行分组。理由便于分组，容易维护，也更容易理解