분류
bootstrap
버튼 활용법
본문
부트스트랩에서 버튼을 사용하는 것은 대부분이 그렇듯이 간단합니다..
관련 클래스만 추가하면 되는데 아래와 같은 것이 있습니다...
Default Primary Success Info Warning Danger Link
<button type="button" class="btn btn-default">Default</button>
<button type="button" class="btn btn-primary">Primary</button><button type="button" class="btn btn-success">Success</button>
<button type="button" class="btn btn-info">Info</button>
<button type="button" class="btn btn-warning">Warning</button>
<button type="button" class="btn btn-danger">Danger</button>
<button type="button" class="btn btn-link">Link</button>
버튼에서 뿐만이 아니라 <a 태그에서도 위 클래스를 추가하면 버튼으로 작동합니다..
버튼의 사이즈 역시 클래스를 추가하면 되는데 아래와 같은 것들이 있습니다..
btn-lg
btn-md
btn-sm
btn-xs
그 외에 버튼을 블럭처리할 경우 btn-block
버튼의 활성화(선택상황)는 active
비활성화(선택하지 못하게)는 disabled
클래스 추가만으로 얼마든지 버튼처리를 할 수 있는 이것이 부트스트랩의 매력입니다..
- 이전글부트스트랩과 경쟁하는 솔루션들.. 15.05.11
- 다음글홈페이지에 부트스트랩을 입히는 가장 간단한 방법 14.11.12