ブートストラップフォーム制御オーバーライドcol-sm-3

-1

ブートストラップ3.3.6でログインページを作成していますが、フォームにcol-sm-3を設定しましたが、class = "form-control"を持つ入力がこれを上書きしますフルスクリーンで表示されます。私がclass = "form-control"を入力から取り除くとうまくいきます。どうしてこれなの？これをどうやって解決するのですか？ブートストラップフォーム制御オーバーライドcol-sm-3

<!doctype html> 
 
<html> 
 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>Bootstrap</title> 
 
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"> 
 
</head> 
 
<body> 
 

 

 
<form closs="col-sm-3"> 
 
\t 
 
<div class="form-group"> 
 
<label for="email">Email </label> 
 
<input type="email" placeholder="Enter email" class="form-control"></input> 
 

 
</div> 
 

 
<div class="form-group"> 
 
<label for="password">Password </label> \t 
 
<input type="password" placeholder="Enter email" class="form-control"></input> 
 

 
</div> 
 

 

 
<button class="btn btn-primary">Login</button> 
 
</form> 
 

 

 
<script type="text/javascript" src="js/bootstrap.min.js"></script> 
 
<script type="text/javascript" src="js/jquery-3.1.0.min.js"></script> 
 
</body> 
 
</html>

出典

2016-07-23 bitto

I、クラス= "入力グループ" を使用してこの問題を解決しました。私はまだ理由がない。

<form closs="col-sm-3"> 

<div class="form-group"> 
<label for="email">Email </label> 
<div class="input-group"> 
<input type="email" placeholder="Enter email" class="form-control">  </input> 
</div> 
</div> 

<div class="form-group"> 
<label for="password">Password </label> 
<div class="input-group"> 
<input type="email" placeholder="Enter email" class="form-control"> </input> 
</div> 

</div> 


<button class="btn btn-primary">Login</button> 
</form>

出典

2016-07-23 11:56:33 bitto

私は

<form class="form-horizontal"> 
 
    <div class="form-group"> 
 
    <label for="inputEmail3" class="col-sm-2 control-label">Email</label> 
 
    <div class="col-sm-10"> 
 
     <input type="email" class="form-control" id="inputEmail3" placeholder="Email"> 
 
    </div> 
 
    </div> 
 
    <div class="form-group"> 
 
    <label for="inputPassword3" class="col-sm-2 control-label">Password</label> 
 
    <div class="col-sm-10"> 
 
     <input type="password" class="form-control" id="inputPassword3" placeholder="Password"> 
 
    </div> 
 
    </div> 
 
    <div class="form-group"> 
 
    <div class="col-sm-offset-2 col-sm-10"> 
 
     <div class="checkbox"> 
 
     <label> 
 
      <input type="checkbox"> Remember me 
 
     </label> 
 
     </div> 
 
    </div> 
 
    </div> 
 
    <div class="form-group"> 
 
    <div class="col-sm-offset-2 col-sm-10"> 
 
     <button type="submit" class="btn btn-default">Sign in</button> 
 
    </div> 
 
    </div> 
 
</form>

をこのデモを使用してこの問題を解決し、CSSを追加して、JS

出典

2016-09-22 06:33:15

ブートストラップフォーム制御オーバーライドcol-sm-3

答えて

関連する問題