嵌套不能按预期工作
问题描述:
我想在title
类中嵌套h1
,但由于某种原因,它只是不想发生。嵌套不能按预期工作
.title {
display: flex;
overflow: hidden;
align-items: center;
h1 {
color: #717171;
font-size: 500%;
}
}
当检查元素时,h1
没有上述任何属性。 当我使用下面的代码时,一切正常。
.title h1 {
color: #717171;
font-size: 500%;
}
可能是什么原因? 我使用C9云IDE与HTML模板,据我所知,它有SCSS
预处理器。
答
如果它是sass
,那么你的语法是错误的,sass和scss有不同的语法。
您在青菜的风格应该是这样的:
.title
display: flex
overflow: hidden
align-items: center
h1
color: #717171
font-size: 500%
和SCSS是像你已经有:
.title {
display: flex;
overflow: hidden;
align-items: center;
h1 {
color: #717171;
font-size: 500%;
}
}
你可以随时在sassmeister检查您的语法错误青菜,这个网站可以检查sass和scss,你也可以选择你想测试的版本。
+0
嘿,对不起,我的标签误导了你。 Scss标签几乎不存在,而Sass有更多的内容,这就是为什么我这样标记它。我将编辑帖子,指出它是SCSS。 – Kappa
其工作正常https://jsfiddle.net/6wL03u2d/ – bhv