问题描述
我有几行Sass:
.content{
width: 960px;
padding: 15px 0;
margin: auto;
background: inherit;
p{
text-align: justify;
padding: 10px;
}
}
在某些地方,我想扩展一个类。内容,像这样:
In some place I want to extend a class with .content, like this:
.header{
position: relative;
@extend .content;
}
事情是,它显然也扩展了p标签。 content2,但是这是一个问题,因为我在.header里面有一个p标签,我不想继承这个填充和文本对齐,我不知道是否可能继承第一级.content(从宽度到背景)。
The thing is that it obviously also extends the "p" tag inside ".content2, but that's a problem for me, because I have a "p" tag inside ".header", and I don't want it to inherit that padding and that text-align, I don't know if it's possible to just to inherit the first level of ".content" (from width to background).
推荐答案
你扩展所有具有相同名字的选择器(包括 .foo .content
)。你最好的选择是有多个选择器扩展:
No. If you extend a selector, you extend all of the selectors that have the same name (including .foo .content
). Your best option is to have multiple selectors to extend from:
%foo {
width: 960px;
padding: 15px 0;
margin: auto;
background: inherit;
}
.content {
@extend %foo;
p {
text-align: justify;
padding: 10px;
}
}
.header {
@extend %foo;
}
这篇关于只扩展Sass上的第一级的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!