Sass 的子选择器的正确语法是什么?
What is the proper syntax for child selectors with Sass?
我正在将我当前的 css 文件转换为 scss。我应该提一下,这是我第一次尝试使用 Sass,到目前为止一切进展顺利。关于 Sass 的子选择器,我有一个问题。我有以下代码:
.ticker-basic.holiday2013 {
background-color:#e4242b !important;
color:#ffffff;
text-decoration:none;
font-weight:normal;
font-size:14px;
font-family: 'HelveticaNeueW01-85Heav', Helvetica, Arial, sans-serif;
letter-spacing: -1px;
text-transform: lowercase;
p {
text-transform: capitalize;
}
p > a {
color:#ffffff;
text-decoration: underline;
font-weight:normal;
font-size:10px;
}
}
我可以在上面的 p 标签中嵌套子 a 标签吗?比如这样:
p {
text-transform: capitalize;
> a {
color:#ffffff;
text-decoration: underline;
font-weight:normal;
font-size:10px;
}
}
p {
> a {
...
}
}
仅适用于段落元素的直接同级锚点,而
p {
a {
...
}
}
将应用于段落元素内的所有锚点。但这没有任何行为变化,如 css 或 sass。您似乎正朝着正确的方向前进。没有比自己玩和学习更好的学习方法了。
我正在将我当前的 css 文件转换为 scss。我应该提一下,这是我第一次尝试使用 Sass,到目前为止一切进展顺利。关于 Sass 的子选择器,我有一个问题。我有以下代码:
.ticker-basic.holiday2013 {
background-color:#e4242b !important;
color:#ffffff;
text-decoration:none;
font-weight:normal;
font-size:14px;
font-family: 'HelveticaNeueW01-85Heav', Helvetica, Arial, sans-serif;
letter-spacing: -1px;
text-transform: lowercase;
p {
text-transform: capitalize;
}
p > a {
color:#ffffff;
text-decoration: underline;
font-weight:normal;
font-size:10px;
}
}
我可以在上面的 p 标签中嵌套子 a 标签吗?比如这样:
p {
text-transform: capitalize;
> a {
color:#ffffff;
text-decoration: underline;
font-weight:normal;
font-size:10px;
}
}
p {
> a {
...
}
}
仅适用于段落元素的直接同级锚点,而
p {
a {
...
}
}
将应用于段落元素内的所有锚点。但这没有任何行为变化,如 css 或 sass。您似乎正朝着正确的方向前进。没有比自己玩和学习更好的学习方法了。