부트 스트랩 입력 그룹이 동일하지 않습니까?

Question

그래서 나는 로그인 예제를 얻었고, 어디로 갔는지 알아 내지 못합니다. 여기 사진이 있습니다. 맨 위의 그림은 내 브라우저에서 코드를 로컬에서 실행할 때 얻는 것입니다.하지만 부트 스트랩 사이트의 예제는 아래에서 두 번째와 같습니다. 내가 뭘 놓치고 있니?

건배,

사이먼 여기

뿐만 아니라, 내가 사용 코드입니다 :

<div class="container"> 

    <form class="form-signin" role="form"> 
    <h2 class="form-signin-heading">Please sign in</h2> 
    <input type="email" class="form-control" placeholder="Email address" required autofocus> 
    <input type="password" class="form-control" placeholder="Password" required> 
    <div class="checkbox"> 
     <label> 
     <input type="checkbox" value="remember-me"> Remember me 
     </label> 
    </div> 
    <button class="btn btn-lg btn-primary btn-block" type="submit">Sign in</button> 
    </form> 

</div> <!-- /container --> 

Answer 1

예 로그인 양식이 사용자 정의 CSS를 포함하고있다 페이지에서.

http://jsfiddle.net/5Fzbw/

body { 
    padding-top: 40px; 
    padding-bottom: 40px; 
    background-color: #eee; 
} 

.form-signin { 
    max-width: 330px; 
    padding: 15px; 
    margin: 0 auto; 
} 
.form-signin .form-signin-heading, 
.form-signin .checkbox { 
    margin-bottom: 10px; 
} 
.form-signin .checkbox { 
    font-weight: normal; 
} 
.form-signin .form-control { 
    position: relative; 
    height: auto; 
    -webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box; 
      box-sizing: border-box; 
    padding: 10px; 
    font-size: 16px; 
} 
.form-signin .form-control:focus { 
    z-index: 2; 
} 
.form-signin input[type="email"] { 
    margin-bottom: -1px; 
    border-bottom-right-radius: 0; 
    border-bottom-left-radius: 0; 
} 
.form-signin input[type="password"] { 
    margin-bottom: 10px; 
    border-top-left-radius: 0; 
    border-top-right-radius: 0; 
}