CSS 后代选择器正确写法 爸爸儿子之间有代沟
example:
> <body>
> <div class="outer">
> <span class="inner"></span>
> </div>
> </body>
> <head>
> <style>
> 错误写法,如下
> 爸爸.outer 和儿子.inner 亲密无间,爷俩之间没有空格,
> 这是错误的“后代选择器”的写法,导致代码不生效。
> .outer.inner{
> height: 30px;
> display: block;
> background: pink;
> }
>
> 正确写法,如下
> .outer .inner{
> height: 30px;
> display: block;
> background: pink;
> }
> 爸爸 .outer 和儿子.inner 之间有代沟,父子之间有个空格
> 是“后代选择器”的正确写法,代码正确被执行,
> </style>
> </head>
错误代码执行的结果,如下
.outer 和 .inner 之间,没有空格,是错误的写法,span 的样式并没有发生变化
————————————————————
正确代码执行的结果,如下
.outer 和 .inner 之间,有空格,是正确的写法,span 的样式发生了变化
July2024the08thMonday