php中类别选择器,类选择器

选择器,类选择器"/>

php中类别选择器,类选择器

类选择器允许以一种独立与文档元素的方式来制定样式

例如: .class{}(注意是点开头的哦,这是类选择器的标志,点后面是属性名,大括号里面就是具体的设置)

下面我们就来简单举例:

html 文件:

php中文网

css 文件:.div{color: cadetblue;

}

这样就可以实现定制效果:

前面我们还接触过,将类选择器结合元素选择器来使用.下面再添加一个:

php中文网

下面我们将 css 文件如下修改:h1.div{color: cadetblue;

}

这样在类选择器前面加了元素描述以后,这个.div 就只会对 h1 起作用.

下面我们来看看具体的效果:

下面我们要讲的就是多类选择器:.class.class{} 这个在先前我们没有接触过.下面我们就来边写边感受: html 文件列出几个 p 字段,到时好比较:

php中文网

php中文网

php中文网

css 文件没一个选择器修改一处设置,地一个颜色蓝黑,第二个字体大小 20px,第三个字体样式斜体:.p1{    color: cadetblue;

}.p2{    font-size: 20px;

}.p3{    font-style: italic;

}

下面就是效果截图:

下面我们就来使用多类选择器:

这里就只需要将 css 文件中 p3 改为 .p1.p2 就好,另外在 html 引用时将第三个 p 标签 class 进行修改: css:.p1.p2{    font-style: italic;

}

html:

php中文网

下面就是结果图:

这里我们看出,第三个段即有 p1 颜色的修改,也有 p2 字体大小的修改,还有自己斜体的修改.这就是多类选择器的应用.