컴포넌트

컴포넌트 : 특정 기능이나 기능들의 집합을 의미
- 독립적으로 설계된 기능, 재사용이 가능한 모듈 또는 단위
- 객체, 기능, 메서드 등

 

Button

 - 클릭 가능한 버튼을 생성

 - 부트스트랩으로 버튼을 시작할 때 class 내부에 btn(버튼 시작) 기능을 작성해주고, 추가로 작성하고픈 내용을 작성

결과

input 안에 있는 type="button"을 사용하길 원한다면

 

    <input type="button" class="btn btn-primary" value="인풋버튼">

 

a태그를 버튼처럼 사용하길 원한다면 다음과 같이 사용

    <a href="#" class="btn btn-danger">a태그버튼</a>

그림처럼 버튼이 된다

 

 

* 테두리 형식 버튼으로 만들기

 

기존과 유사하나, btn과 색상 사이에 outline을 넣는다.

 

결과

 

 

* 버튼 크기 조정하기

 

- 버튼의 크기는 btn-lg나 btn-sm 같은 크기 조정 설정을 적용하거나 padding을 활용해서 버튼의 크기를 조정할 수 있음

 

결과

 

* 버튼 비활성화

 

class에 disabled를 추가하면 비활성화가 가능.

 

a태그 버튼을 비활성화 하려면 aria-disabled="true"를 더 추가해야함.