재단 입력 상자? 크기
격자 열을 사용하여 이와 같이, 입력 상자의 크기를 설정하는 방법 .large-6 , .medium-6 등등, 및.
더 많은 지식 그리드 시스템, 당신은 클릭 할 수 있습니다 그리드 시스템 튜토리얼.
예
<양식>
<사업부 클래스 = "행">
<사업부 클래스 = "큰-10 중간 7 열">
<레이블> 큰-10 중간 7 (소형 100 %)
<입력 유형 = "텍스트"자리 = "이름">
</ 라벨>
</ DIV>
</ DIV>
<사업부 클래스 = "행">
<사업부 클래스 = "작은 5 열">
<레이블> 작은-5
<입력 유형 = "텍스트"자리 = "이름">
</ 라벨>
</ DIV>
</ DIV>
<사업부 클래스 = "행">
<사업부 클래스 = "중간 3 열">
<레이블> 매체-3 (100 소형의 %)
<입력 유형 = "텍스트"자리 = "이름">
</ 라벨>
</ DIV>
</ DIV>
</ FORM>
<사업부 클래스 = "행">
<사업부 클래스 = "큰-10 중간 7 열">
<레이블> 큰-10 중간 7 (소형 100 %)
<입력 유형 = "텍스트"자리 = "이름">
</ 라벨>
</ DIV>
</ DIV>
<사업부 클래스 = "행">
<사업부 클래스 = "작은 5 열">
<레이블> 작은-5
<입력 유형 = "텍스트"자리 = "이름">
</ 라벨>
</ DIV>
</ DIV>
<사업부 클래스 = "행">
<사업부 클래스 = "중간 3 열">
<레이블> 매체-3 (100 소형의 %)
<입력 유형 = "텍스트"자리 = "이름">
</ 라벨>
</ DIV>
</ DIV>
</ FORM>
»시도
컬럼의 크기와 동일
다음은 동일한 크기의 컬럼의 예를 보여줍니다
예
<양식>
<사업부 클래스 = "행">
<사업부 클래스 = "중간 4 열">
<레이블> 매체-4 (100 에 % 작은 누적)
<입력 유형 = "텍스트"자리 = "이름">
</ 라벨>
</ DIV>
<사업부 클래스 = "중간 4 열">
<레이블> 매체-4 (100 에 % 작은 누적)
<입력 유형 = "텍스트"자리 = "이름">
</ 라벨>
</ DIV>
<사업부 클래스 = "중간 4 열">
<레이블> 매체-4 (100 에 % 작은 누적)
<입력 유형 = "텍스트"자리 = "이름">
</ 라벨>
</ DIV>
</ DIV>
</ FORM>
<사업부 클래스 = "행">
<사업부 클래스 = "중간 4 열">
<레이블> 매체-4 (100 에 % 작은 누적)
<입력 유형 = "텍스트"자리 = "이름">
</ 라벨>
</ DIV>
<사업부 클래스 = "중간 4 열">
<레이블> 매체-4 (100 에 % 작은 누적)
<입력 유형 = "텍스트"자리 = "이름">
</ 라벨>
</ DIV>
<사업부 클래스 = "중간 4 열">
<레이블> 매체-4 (100 에 % 작은 누적)
<입력 유형 = "텍스트"자리 = "이름">
</ 라벨>
</ DIV>
</ DIV>
</ FORM>
»시도
인라인 태그
당신이 원하는 경우 라벨의 내용은 왼쪽 (안 위), 서로 다른 컬럼의 왼쪽 입력에있는 상자에 요소 레이블 태그를 사용할 수 있습니다에 표시 .inline 수직 중심을 설정하는 클래스를 :
예
<양식>
<사업부 클래스 = "행">
<사업부 클래스 = "작은-8 ">
<사업부 클래스 = "행">
<사업부 클래스 = "작은 3 열">
<= "이름"클래스 레이블 = "인라인 바로"> 이름 </ 라벨>
</ DIV>
<사업부 클래스 = "작은-9 열">
<입력 유형 = "텍스트"ID = "이름"자리 = "이름 ..">
</ DIV>
</ DIV>
</ DIV>
</ DIV>
</ FORM>
<사업부 클래스 = "행">
<사업부 클래스 = "작은-8 ">
<사업부 클래스 = "행">
<사업부 클래스 = "작은 3 열">
<= "이름"클래스 레이블 = "인라인 바로"> 이름 </ 라벨>
</ DIV>
<사업부 클래스 = "작은-9 열">
<입력 유형 = "텍스트"ID = "이름"자리 = "이름 ..">
</ DIV>
</ DIV>
</ DIV>
</ DIV>
</ FORM>
»시도
전면 및 후면 라벨
당신은 할 수 있습니다 <div class="row collapse"> > 전면 및 후면 탭 요소를 추가 : < element class="postfix"> 또는 < element class="prefix"> . 앞뒤 라벨의 크기를 설정하는 그리드 시스템을 사용할 수있다 :
예
<양식>
<사업부 클래스 = "행">
<사업부 클래스 = "큰 6 열">
<사업부 클래스 = "행 붕괴 접두사 -radius">
<사업부 클래스 = "작은 3 열">
<스팬 클래스 = "접두어"> 접두사 </ SPAN>
</ DIV>
<사업부 클래스 = "작은-9 열">
<입력 유형 = "텍스트"자리 = "값">
</ DIV>
</ DIV>
</ DIV>
<사업부 클래스 = "큰 6 열">
<사업부 클래스 = "행 붕괴 후위 -radius">
<사업부 클래스 = "작은-9 열">
<입력 유형 = "텍스트"자리 = "값">
</ DIV>
<사업부 클래스 = "작은 3 열">
<스팬 클래스 = "접미사"> 접미사 </ SPAN>
</ DIV>
</ DIV>
</ DIV>
</ DIV>
</ FORM>
<사업부 클래스 = "행">
<사업부 클래스 = "큰 6 열">
<사업부 클래스 = "행 붕괴 접두사 -radius">
<사업부 클래스 = "작은 3 열">
<스팬 클래스 = "접두어"> 접두사 </ SPAN>
</ DIV>
<사업부 클래스 = "작은-9 열">
<입력 유형 = "텍스트"자리 = "값">
</ DIV>
</ DIV>
</ DIV>
<사업부 클래스 = "큰 6 열">
<사업부 클래스 = "행 붕괴 후위 -radius">
<사업부 클래스 = "작은-9 열">
<입력 유형 = "텍스트"자리 = "값">
</ DIV>
<사업부 클래스 = "작은 3 열">
<스팬 클래스 = "접미사"> 접미사 </ SPAN>
</ DIV>
</ DIV>
</ DIV>
</ DIV>
</ FORM>
»시도
전면 및 후면 탭 버튼
당신은 사용할 수 있습니다 <a> 요소를 추가 .button 전면 및 후면 버튼을 설정하는 클래스 :
전면 및 후면 라벨 라운드 단추
예
<양식>
<사업부 클래스 = "행">
<사업부 클래스 = "큰 6 열">
<사업부 클래스 = "행 붕괴 접두사 -radius">
<사업부 클래스 = "작은 3 열">
<스팬 클래스 = "접두어"> 접두사 </ SPAN>
</ DIV>
<사업부 클래스 = "작은-9 열">
<입력 유형 = "텍스트"자리 = "값">
</ DIV>
</ DIV>
</ DIV>
<사업부 클래스 = "큰 6 열">
<사업부 클래스 = "행 붕괴 후위 -radius">
<사업부 클래스 = "작은-9 열">
<입력 유형 = "텍스트"자리 = "값">
</ DIV>
<사업부 클래스 = "작은 3 열">
<스팬 클래스 = "접미사"> 접미사 </ SPAN>
</ DIV>
</ DIV>
</ DIV>
</ DIV>
<사업부 클래스 = "행">
<사업부 클래스 = "큰 6 열">
<사업부 클래스 = "행 붕괴 접두사 - 원형">
<사업부 클래스 = "작은 3 열">
href가 = "#" 클래스 = "button prefix"> 이동 </ A>
</ DIV>
<사업부 클래스 = "작은-9 열">
<입력 유형 = "텍스트"자리 = "값">
</ DIV>
</ DIV>
</ DIV>
<사업부 클래스 = "큰 6 열">
<사업부 클래스 = "행 붕괴 후위 - 원형">
<사업부 클래스 = "작은-9 열">
<입력 유형 = "텍스트"자리 = "값">
</ DIV>
<사업부 클래스 = "작은 3 열">
href가 = "#" 클래스 = "button postfix"> 이동 </ A>
</ DIV>
</ DIV>
</ DIV>
</ DIV>
</ FORM>
<사업부 클래스 = "행">
<사업부 클래스 = "큰 6 열">
<사업부 클래스 = "행 붕괴 접두사 -radius">
<사업부 클래스 = "작은 3 열">
<스팬 클래스 = "접두어"> 접두사 </ SPAN>
</ DIV>
<사업부 클래스 = "작은-9 열">
<입력 유형 = "텍스트"자리 = "값">
</ DIV>
</ DIV>
</ DIV>
<사업부 클래스 = "큰 6 열">
<사업부 클래스 = "행 붕괴 후위 -radius">
<사업부 클래스 = "작은-9 열">
<입력 유형 = "텍스트"자리 = "값">
</ DIV>
<사업부 클래스 = "작은 3 열">
<스팬 클래스 = "접미사"> 접미사 </ SPAN>
</ DIV>
</ DIV>
</ DIV>
</ DIV>
<사업부 클래스 = "행">
<사업부 클래스 = "큰 6 열">
<사업부 클래스 = "행 붕괴 접두사 - 원형">
<사업부 클래스 = "작은 3 열">
href가 = "#" 클래스 = "button prefix"> 이동 </ A>
</ DIV>
<사업부 클래스 = "작은-9 열">
<입력 유형 = "텍스트"자리 = "값">
</ DIV>
</ DIV>
</ DIV>
<사업부 클래스 = "큰 6 열">
<사업부 클래스 = "행 붕괴 후위 - 원형">
<사업부 클래스 = "작은-9 열">
<입력 유형 = "텍스트"자리 = "값">
</ DIV>
<사업부 클래스 = "작은 3 열">
href가 = "#" 클래스 = "button postfix"> 이동 </ A>
</ DIV>
</ DIV>
</ DIV>
</ DIV>
</ FORM>
»시도