練習的結果有點疑問
.error, .seriousError {
? border: 1px #f00;
? background-color: #fdd; }
.error.intrusion, .intrusion.seriousError {
? background-image: url("/image/hacked.png"); }
.seriousError {
? border-width: 3px; }
練習中的編譯結果是這樣的,不明白中間為什么是.intrusion.seriousError ,難道不應該是.error.seriousError 嗎,有人知道是為什么嗎
2016-09-23
嗯,有道理。謝謝。
不過這個是不是應該這么寫呀。
.error {
?border: 1px #f00;
?background-color: #fdd;
? ? &.intrusion {
? ?background-image: url("/image/hacked.png");
? ?}
}
2016-09-22
可能在SCSS中,.error {
?border: 1px #f00;
?background-color: #fdd;
}
.error.intrusion {
?background-image: url("/image/hacked.png");
}
是等價與.error {
?border: 1px #f00;
?background-color: #fdd;
????.intrusion {
? ?background-image: url("/image/hacked.png");
? ?}
}的
.seriousError中繼承了.error的樣式,所以
.seriousError{
?border: 1px #f00;
?background-color: #fdd;
????.intrusion {
? ?background-image: url("/image/hacked.png");
? ?}
}
解析成css,代碼合并后成了那個樣子