IT story

여러 클래스에 스타일을 한 번에 적용하려면 어떻게해야합니까?

hot-time 2020. 4. 19. 13:58
반응형

여러 클래스에 스타일을 한 번에 적용하려면 어떻게해야합니까?


이름이 다른 두 클래스가 CSS에서 동일한 속성을 갖기를 원합니다. 코드를 반복하고 싶지 않습니다.

.abc {
   margin-left:20px;
}  
.xyz {
   margin-left:20px;
}
<a class="abc">Lorem</a>
<a class="xyz">Ipsum</a>

두 클래스가 모두 같은 일을하고 있기 때문에 하나로 병합 할 수 있어야합니다. 어떻게해야합니까?


.abc, .xyz { margin-left: 20px; }

당신이 찾고있는 것입니다.


쉼표로 구분하여 동일한 속성에 대해 여러 CSS 선언을 가질 수 있습니다.

.abc, .xyz {
   margin-left: 20px;
}

CSS를 반복하지 마십시오

 a.abc, a.xyz{
    margin-left:20px;
 }

또는

 a{
    margin-left:20px;
 }

다음과 같이 사용하면 작성한 코드보다 더 효과적 일 수 있습니다. 다른 기능을 추가해야합니다.

.abc, .xyz {
margin-left:20px;
width: 100px;
height: 100px;
} 

또는

a.abc, a.xyz {
margin-left:20px;
width: 100px;
height: 100px;
} 

또는

a {
margin-left:20px;
width: 100px;
height: 100px;
} 

참고 URL : https://stackoverflow.com/questions/2099252/how-can-i-apply-styles-to-multiple-classes-at-once

반응형