부트스트랩 4가지 색상
텍스트 색상
부트스트랩 4에는 "색상을 통한 의미"를 제공하는 데 사용할 수 있는 몇 가지 컨텍스트 클래스가 있습니다.
텍스트 색상에 대한 클래스는 .text-muted
,
.text-primary
, .text-success
, .text-info
,
.text-warning
, .text-danger
, .text-secondary
, .text-white
,
.text-dark
, .text-body
(기본 바디 색상/종종 검정색) 및 .text-light
:
예시
This text is muted.
This text is important.
This text indicates success.
This text represents some information.
This text represents a warning.
This text represents danger.
Secondary text.
Dark grey text.
Body text.
Light grey text.
상황에 맞는 텍스트 클래스는 링크에서도 사용할 수 있습니다. 그러면 더 어두운 호버 색상이 추가됩니다.
예시
.text-black-50
또는 .text-white-50
클래스 를 사용하여 흑백 텍스트에 50% 불투명도를 추가할 수도 있습니다 .
예시
Black text with 50% opacity on white background
White text with 50% opacity on black background
배경색
배경색에 대한 클래스는 , .bg-primary
,
.bg-success
, .bg-info
, .bg-warning
, .bg-danger
및 입니다 ..bg-secondary
.bg-dark
.bg-light
.text-*
배경색은 텍스트 색상을 설정하지 않으므로 경우에 따라 클래스 와 함께 사용하려는 경우가 있습니다 .
예시
This text is important.
This text indicates success.
This text represents some information.
This text represents a warning.
This text represents danger.
Secondary background color.
Dark grey background color.
Light grey background color.