css 中多个class选择器的详解

ml中：

<div class="containerA">
    这是AAAAAAAAAAAAAAAAAAAAAAA样式<div class="containerB">
        这是BBBBBBBBBBBBBBBBBBBBBB样式</div>
</div>

css中：

.containerA .containerB {color: red;
    font-size: 28px;
}

.containerA ,.containerB {color: red;
    font-size: 28px;
}

这两种写法是有区别的，前者用空格隔开，表示接下来对A下面的B样式进行修改。

如图：

而后者用逗号隔开，表示接下来对A和B两者的样式都进行修改。

如图：

虽然，我们再用的时候往往两者没啥区别，但是还是要理解它的原理，有时候在一些样式需要change的时候（用空格分开）还是很管用的！

css 中多个class选择器的详解相关推荐

css中“[]”、“”“~”、“，”、“+”和“”详解
p~ul{background:#8e8e8e; } <p>段落P</p> <ul><li>列表项1</li><li>列表项2& ...
CSS中特性查询（@supports）详解及使用
1. 简介 CSS中的 @supports 用于检测浏览器是否支持 CSS 的某个属性.其实就是条件判断,如果支持某个属性可以写一套样式,如果不支持某个属性,可以提供另外一套样式作为替补.可以放在代码 ...
CSS中position的4种定位详解
大家都知道,css中的position有4种取值,分别是static.fixed.relative.absolute. 详细解释: static:相当于没有定位,元素会出现在正常的文档流中. fixe ...
CSS中#号、.号、*号详解
#: #号的作用是控制对应div的css样式,具体事例如下: HTML代码: <div id="jinghao"> </div> CSS代码: #jingh ...
css三种定位都脱离文档流了吗,CSS布局之脱离文档流详解——浮动、绝对定位脱离文档流的区别...
1.代码 (1)示例代码1 CSS布局之脱离文档流详解--浮动.绝对定位脱离文档流的区别 .left { width: 300px; height: 500px; background: red; f ...
[css] css中class和id选择器有什么区别？
[css] css中class和id选择器有什么区别? id 在部分浏览器的 js 中会直接生成同名变量: id 的唯一性,获取该 id 的 dom 时,会取同名 id 的前者: id 层叠权重非常高 ...
[css] 为什么说css中能用子代选择器的时候不要用后代选择器？
[css] 为什么说css中能用子代选择器的时候不要用后代选择器? 选择从右到左依次解析匹配,所以后代选择器会去找它的所有父级, 而子代选择器只会选择直接的父级:减少匹配次数,提高效率个人简介我是 ...
css 选父元素,CSS中模拟父元素选择器
很多情况下,我们需要找到父元素,但可惜的是css中并没有这样的一个选择器. 至于原因可以看张鑫旭的如何在CSS中实现父选择器效果这篇文章. 简单来说这个实现并不是真正的父元素选择器,只是利用其它思路来 ...
友情链接在html中怎么写,HTML+CSS入门网站友情链接显示页面详解
本篇教程介绍了HTML+CSS入门网站友情链接显示页面详解,希望阅读本篇文章以后大家有所收获,帮助大家HTML+CSS入门. < 1.列表标签有序列表:type默认是1,2,3--,rese ...

css 中多个class选择器的详解

css 中多个class选择器的详解相关推荐

最新文章

热门文章