Opacity
Opacity (불투명도)
요소의 불투명도를 조절하는 유틸리티 클래스에 대해 알아봅니다.
출처: 문서
본문
opacity 프로퍼티는 요소의 불투명도 수준을 설정합니다. 불투명도 수준은 투명도의 정도를 나타내는데, 1은 전혀 투명하지 않음, .5는 50% 보임, 0은 완전히 투명함을 의미합니다.
.opacity-{value} 유틸리티를 사용해 요소의 불투명도를 설정할 수 있습니다.
<div class="opacity-100">...</div>
<div class="opacity-75">...</div>
<div class="opacity-50">...</div>
<div class="opacity-25">...</div>
<div class="opacity-0">...</div>
CSS
Sass utilities API
opacity 유틸리티는 scss/_utilities.scss의 utilities API에 선언되어 있습니다. utilities API 사용법을 알아보세요.
scss/_utilities.scss
"opacity": (
property: opacity,
values: (
0: 0,
25: .25,
50: .5,
75: .75,
100: 1,
)
),