0
하나의 컨트롤, 2 개의 컨트롤 및 3 개의 컨트롤과 그룹의 맨 위에 레이블이 혼합 된 양식을 만들려고합니다. 다음은 내 HTML입니다. 아무도 내가 다음 양식을 정렬하는 데 도움이 될 수 있습니까?레이블의 부트 스트랩 정렬
<div class=" col-xs-6 col-xs-offset-3">
<div class="row">
<label>Label1</label><span class="mandatory">*</span>
<div>
<div class="col-sm-2 col-xs-12 form-group">
<select class="form-control input-sm"></select>
</div>
<div class="col-sm-5 col-xs-12 form-group">
<input type="text" class="form-control input-sm"
required />
</div>
<div class="col-sm-5 col-xs-12 form-group">
<input type="text" class="form-control input-sm" required />
</div>
</div>
</div>
<div class="row">
<label>Label2</label><span class="mandatory">*</span>
<div>
<div class="col-xs-12 form-group">
<input type="text" class="form-control input-sm" required />
</div>
</div>
</div>
<div class="row">
<div class="col-sm-6 col-xs-12 form-group">
<label>Label3</label><span class="mandatory">*</span>
<div class="input-group date">
<label class="input-group-addon">##</label>
<input type="text" class="form-control" />
</div>
</div>
<div class="col-sm-6 col-xs-12 form-group">
<label>Label4</label><span class="mandatory">*</span>
<input type="text" class="form-control" />
</div>
</div>
<div class="row">
<label>Label5</label><span class="mandatory">*</span>
<div>
<div class="col-sm-2 col-xs-12 form-group">
<input type="text" class="form-control input-sm" required />
</div>
<div class="col-sm-5 col-xs-12 form-group">
<input type="text" class="form-control input-sm" required />
</div>
<div class="col-sm-5 col-xs-12 form-group">
<input type="text" class="form-control input-sm" required />
</div>
<div class="col-sm-6 col-xs-12 form-group">
<input type="text" class="form-control input-sm" required />
</div>
<div class="col-sm-6 col-xs-12 form-group">
<select class="form-control input-sm"></select>
</div>
</div>
</div>
<div class="row">
<label>Label6</label><span class="mandatory">*</span>
<div>
<div class="col-xs-12 form-group">
<input type="email" class="form-control input-sm" required />
</div>
</div>
</div>
<div class="row">
<div class="col-sm-6 col-xs-12 form-group">
<label>Label7</label><span class="mandatory">*</span>
<input type="text" class="form-control" required />
</div>
<div class="col-sm-6 col-xs-12 form-group">
<label>Label8</label>
<input type="text" class="form-control" required />
</div>
</div> </div>
바이올린 링크 https://jsfiddle.net/nxLz2up3/
3 일을하려고합니다. 레이아웃을 바라는 모양이 무엇인지는 분명하지 않습니다. 2. 들여 쓰기 및 예제 코드를 항상 깨끗이하십시오. 3. 예제 부트 스트랩 양식 레이아웃이 너무 많아서 Google의 "부트 스트랩 양식 예제", "부트 스트랩 양식 템플릿"등이 있습니다. 일부는 커스텀 부트 스트랩 테마의 일부가 될 것이지만, 그 테마는 대부분 사소한 룩앤필에 영향을 미칩니다. 그리드 레이아웃 예제는 때때로 사용할 수 있으며, 다양한 폼 레이아웃에 대한 전용 목록과 사이트가 많이 있습니다. –