보조 클래스 부트 스트랩
이 장에서는 부트 스트랩의 일부가 편리한 헬퍼 클래스에 올 수도에 대해 설명합니다.
본문
다음 다른 클래스는 다른 텍스트 색상을 보여줍니다. 텍스트가 텍스트 위로 마우스를 이동하는 링크 인 경우 흐리게한다 :
범주 | 기술 | 예 |
---|---|---|
는 .text - 음소거 | 텍스트 스타일 "텍스트 음소거"카테고리 | 시험 |
는 .text - 차 | 텍스트 스타일 "텍스트 차"카테고리 | 시험 |
는 .text - 성공 | 텍스트 스타일 "텍스트 성공"카테고리 | 시험 |
는 .text-정보 | 텍스트 스타일 "텍스트 정보 '카테고리 | 시험 |
는 .text 경보 | 텍스트 스타일 "텍스트 경고"카테고리 | 시험 |
는 .text - 위험 | 텍스트 스타일 "텍스트 위험"카테고리 | 시험 |
배경
다음 다른 클래스는 다른 배경 색상을 보여줍니다. 텍스트가 텍스트 위로 마우스를 이동하는 링크 인 경우 흐리게한다 :
범주 | 기술 | 예 |
---|---|---|
.bg - 차 | 은 "BG-차"범주를 사용하여 테이블 셀 | 시험 |
.bg - 성공 | 은 "BG-성공"범주를 사용하여 테이블 셀 | 시험 |
.bg - 정보 | 은 "BG-정보 '카테고리를 사용하여 테이블 셀 | 시험 |
.bg - 경고 | 은 "BG-경고"범주를 사용하여 테이블 셀 | 시험 |
.bg - 위험 | 은 "BG-위험"범주를 사용하여 테이블 셀 | 시험 |
다른
범주 | 기술 | 예 |
---|---|---|
.pull 왼쪽 | 요소는 왼쪽에 떠 | 시험 |
.pull 오른쪽 | 요소는 우측 부동 | 시험 |
.center 블록 | 블록과 중심 : 요소는 디스플레이 설정 | 시험 |
.clearfix | 지우기 플로트 | 시험 |
.show | 필수 요소가 표시됩니다 | 시험 |
.hidden | 필수 요소 숨기기 | 시험 |
.SR 전용 | 스크린 리더, 기타 장치에 숨겨진 요소에 추가 | 시험 |
.SR - - 포커스 만 | 요소가 (: 사용자의 키보드 조작 등) 포커스를받을 때 .SR 전용 클래스와 함께 표시 | 시험 |
는 .text 숨기기 | 텍스트 페이지 요소는 배경을 대체 포함 | 시험 |
.close | 버튼을 오프 표시 | 시험 |
.caret | 표시 드롭 다운 메뉴 | 시험 |
더 많은 예제
닫기 아이콘
모달 상자와 경고 상자를 닫습니다 공통 닫기 아이콘을 사용합니다. 닫기 아이콘을 얻기 위해 가까운클래스를 사용합니다.
결과는 다음과 같다 :
탈자 부호
기능과 방향을 아래로 끌어 캐럿을 사용합니다. 이 기능을 얻으려면클래스 캐럿과 <SPAN> 요소를 사용합니다.
결과는 다음과 같다 :
빠른 부동
각클래스 풀에서 왼쪽으로 당겨 오른쪽또는 왼쪽이나 오른쪽 부동 요소에 사용할 수 있습니다. 다음의 예는이 점을 보여줍니다.
결과는 다음과 같다 :
탐색 모음의 구성 요소를 정렬하려면,.navbar 왼쪽 사용하거나 .navbar-대신.참고 항목 부트 스트랩 탐색 모음을 .
중심 내용
요소를 중앙에클래스 센터 블록을 사용합니다.
예
»시도
결과는 다음과 같다 :
지우기 플로트
부동 요소를 제거하려면,.clearfix 클래스를 사용합니다.
예
»시도
결과는 다음과 같다 :
표시 및 숨기기 콘텐츠
당신은 .show과 올.hidden 클래스의사용을 통해 표시 할 요소 또는 (스크린 리더 포함) 숨기기를 강제 할 수 있습니다.
예
»시도
결과는 다음과 같다 :
스크린 리더
사용자는 스크린 리더 이외에 .SR 전용 숨겨진클래스를 사용하여 장치의 모든 요소를 넣을 수있다.
예
»시도
결과는 다음과 같다 :
여기에서 우리는클래스 SR-에서만 레이블 입력 태그의 두 가지 유형을 볼 수 있으므로 레이블은 화면 판독기에 표시됩니다.