Elements
Elements (요소)
Bulma의 Elements 카테고리는 UI를 구성하는 필수 인터페이스 요소들을 모아 둔 문서예요. 대부분 단 하나의 CSS 클래스만으로 동작하도록 설계되어서, HTML 구조만 잘 잡아 주면 바로 적용할 수 있어요.
출처: 문서
본문
추가적인 클래스나 스타일 없이, 태그 하나에 클래스 하나만 붙이면 되는 기본 요소들로 구성돼요. Elements 섹션에서 다루는 요소들은 다음과 같아요.
- Block — Bulma의 가장 기본적인 스페이서(spacer) 블록
- Box — 다른 요소들을 담는 흰색 박스
- Button — 다양한 색상, 크기, 상태를 가진 클래식 버튼
- Content — HTML 태그만으로 만들어진 WYSIWYG 콘텐츠를 처리하는 단일 클래스
- Delete — 다양하게 활용 가능한 삭제(delete) 크로스
- Icon — Font Awesome 5를 포함한 모든 아이콘 폰트 라이브러리와 호환되는 아이콘
- Image — 반응형 이미지를 담는 컨테이너
- Notification — 사용자에게 무언가를 알려 주는 강렬한 알림 블록
- Progress bars — 네이티브 HTML 프로그레스 바
- Table — 특수한 셀 처리를 지원하는 필수 HTML 테이블
- Tag — 어디에든 붙일 수 있는 작은 태그 라벨
- Title — 페이지에 깊이를 더하는 간단한 제목
각 요소는 아주 작은 조각부터 시작해서 조합할 수 있도록 설계되었어요. 다른 CSS 프레임워크처럼 복잡한 준비 없이도, 원하는 요소의 클래스만 기억하고 있으면 반응형 레이아웃을 금방 만들 수 있어요.