Bootstrap 4 / Button Group / 버튼 묶음 만들기

Button Group

버튼을 연속하여 만들면 가로로 배열되고, 버튼 사이에 간격이 있습니다.

.btn-group로 버튼들을 감싸면 사이의 간격을 없애고, 둥근 모서리를 가진 버튼 묶음을 만들 수 있습니다.

.btn-group의 display 속성의 값은 inline-flex로, 여러 그룹을 만들면 가로 방향으로 배열됩니다.

크기 조절

.btn-group-lg를 추가하면 크기가 커지고, .btn-group-sm을 추가하면 크기가 작아집니다.

세로 방향으로 그룹화하기

세로 방향으로 버튼들을 묶고 싶다면 .btn-group-vertical로 버튼들을 감쌉니다.