在 SASS 中乱搞,但是当我的样式表正在编译时,它会生成这个奇怪的、无效的 css。
.container
padding: 3rem 2.5rem 3rem
background-color: red
因为它可以很好地独立编译,所以它必须是评论中指出的周围的 sass。如果有什么关系,那就是 angular 5 元素:
周围的sass:https://pastebin.com/tMMxf97D
我做错了什么?
最佳答案
您有一些额外的空格和不一致的制表符。我添加变量只是为了测试。 Check my rearranged code
$prim: #cccccc
$dark-prim: #666666
$grey: grey
#wrapper
background: #F7F7F7
.tournament-card
background: #fff
box-shadow: 0 0 7px 0 rgba(0, 0, 0, 0.11)
.card-title
background-color: $dark-prim
padding: 2rem
h1
color: #fff
text-align: center
font-size: 1.2rem
.container
padding: 3rem 2.5rem 3rem
background-color: red
.options
color: $grey
margin-bottom: 1.5rem
button
cursor: pointer
font-size: 1.2rem
color: $prim
border-radius: 4rem
display: block
width: 100%
background: transparent
border: 2px solid $prim
padding: 0.9rem 0 1.1rem
transition: color .5s, border-color .5s
margin-top: 3rem
&:hover,
&:focus
background: $dark-prim
color: white
&:active
transform: translateY(1px)
关于css - SASS 放置双重属性名称,为什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50261374/