//scss
.btn{
position:absolute;
&.active{
color:red;
}
}
.list{
li{
&:last-child{
margin-right:0;
}
}
}
//css
.btn {
position: absolute;
}
.btn.active {
color: red;
}
.list li:last-child {
margin-right: 0;
}
//scss
.fs{
&-small {font-size:12px;}
&-medium {font-size:14px;}
&-small {font-size:16px;}
}
//css
.fs-small {
font-size: 12px;
}
.fs-medium {
font-size: 14px;
}
.fs-small {
font-size: 16px;
}
/*네임스페이스가 동일한 경우의 중첩*/
.box{
font:{
weight:bold;
size:10px;
family:'Poppins';
};
margin:{
top:10px;
left:10px;
};
}
'프론트엔드 공부 > scss' 카테고리의 다른 글
scss 반복문(for $i from 1 from n){} (0) | 2021.05.28 |
---|---|
scss @mixin의 재활용(초깃값 설정과 키워드인수설정) / @content 추가기능 (0) | 2021.05.28 |
scss 산술연산자 (0) | 2021.05.28 |
scss 변수 유효범위 (0) | 2021.05.27 |
scss 간단 표기법과 주석처리,자식선택자(>)사용 (0) | 2021.05.27 |