[!] 본 내용은 아래 링크의 자료를 바탕으로 연습된 내용입니다.

http://getbootstrap.com/css/#forms

(1) 아래와 같이 HTML 페이지를 작성한다.

<link href="Content/bootstrap.css" rel="stylesheet" />

<div class="form-horizontal" role="form">



    <div class="form-group">
        <label for="txtTel" class="col-sm-2 control-label">전화번호: </label>
        <div class="col-sm-10">
            <input type="text" class="form-control" id="txtTel" placeholder="전화번호">
        </div>
    </div>


    <div class="form-group">
        <label for="txtAddress" class="col-sm-2 control-label">주소: </label>
        <div class="col-sm-10">
            <input type="text" class="form-control" id="txtAddress" placeholder="주소">
        </div>
    </div>

    <div class="form-group">
        <label for="optGender" class="col-sm-2 control-label">성별: </label>
        <div class="col-sm-10">

            <label class="radio-inline">
                <input type="radio" name="optGender" id="optGenderMan" value="M">
                남자
            </label>
            <label class="radio-inline">
                <input type="radio" name="optGender" id="optGenderWomen" value="F">
                여자
            </label>

        </div>
    </div>



    <div class="form-group">
        <label for="txtBirth" class="col-sm-2 control-label">생년월일: </label>
        <div class="col-sm-10">
            <div class="row">
                <div class="col-sm-3">
                    <select name="ctl00$MainContent$DropDownList1" id="MainContent_DropDownList1" class="form-control" style="width:100px;">
                        <option value="년">년</option>

                    </select>
                </div>
                <div class="col-sm-3">
                    <select name="ctl00$MainContent$DropDownList2" id="MainContent_DropDownList2" class="form-control" style="width:100px;">
                        <option value="월">월</option>

                    </select>
                </div>
                <div class="col-sm-3">
                    <select name="ctl00$MainContent$DropDownList3" id="MainContent_DropDownList3" class="form-control" style="width:100px;">
                        <option value="일">일</option>

                    </select>
                </div>
            </div>
        </div>
    </div>



    <div class="form-group">
        <label for="lstCountry" class="col-sm-2 control-label">국가: </label>
        <div class="col-sm-10">
            <select name="ctl00$MainContent$lstCountry" id="lstCountry" class="form-control">
                <option value="대한민국">대한민국</option>
                <option value="기타">기타</option>

            </select>
        </div>
    </div>
</div>

(2) bootstrap.css를 적용하기 전의 모습은 아래와 같다.

(3) bootstrap.css를 적용한 후의 모습은 아래와 같다.

끝.