SCSS 작성 하기

형제 선택하기 :

name { &형제name {명령문} }

.sec-g {
    &.sec-sns{
        h2 {
            font-size: 30px;
            color:$green;
        }
    }

마우스 오버 했을때 효과 넣기 : 

name {&:hover {명령문}}

a {
     display: block;
     &:hover {
              color: #dddddd;
     }
}

자신의 명령어는 중괄호안에 바로 작성,

붙어있는 명령어는 중괄호안에 '&'을 앞에 써준후 작성

 

가상클래스 넣기 :

텍스트 하단에 밑줄을 추가하는 등의 경우 가상클래스로 처리 가능

name { &::가상클래스name {명령어} }

 h2 {
        font-size: 20px;
        font-weight: bold;
        text-align: center;
        padding-bottom: 5px;

        &::after {
            border-bottom: 3px solid $tomato;
        }
    }