2017-03-07 23 views
0

我使用引導程序設計我的表單,但它沒有顯示窗體的背景顏色,就像它在示例中一樣。Boostrap不顯示我的表單的背景顏色

所有的字體顏色大小& bootstrap的設計應用,但我的表單的背景丟失。

我也複製並粘貼示例中的所有代碼,看它是否會顯示窗體背景,但即使如此,它也沒有顯示引導主題的背景顏色。

我在我的html文件中包含了bootstrap.cssbootstrap.min.css

這是我使用的主題爲:https://bootswatch.com/flatly/

HTML代碼

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <link rel="stylesheet" href="style.css"> 
    <link rel="stylesheet" href="bootstrap.css"> 
    <link rel="stylesheet" href="bootstrap.min.css"> 
    <title>Users</title> 
</head> 
<body> 
    <form class="form-horizontal col-lg-7" style="border: 1px solid red;" action="/index.php"> 
    <fieldset> 
     <div class="form-group"> 
     <label for="inputUsername" class="col-lg-3 control-label">Username</label> 
     <div class="col-lg-3"> 
      <input type="text" class="form-control" id="inputUsername" placeholder="Enter Username"> 
     </div> 
     </div> 

     <div class="form-group"> 
     <label for="inputPassword" class="col-lg-3 control-label">Password</label> 
     <div class="col-lg-3"> 
      <input type="password" class="form-control" id="inputPassword" placeholder="Password"> 
     </div> 
     </div> 
     <div class="form-group"> 
     <div class="col-lg-10 col-lg-offset-3"> 
      <button type="reset" class="btn btn-default">Reset </button> 
      <button type="submit" class="btn btn-primary">Login </button> 
     </div> 
     </div> 
    </fieldset> 
    </form> 
    </body> 
</html> 
+0

把你的style.css文件放在所有鏈接的底部 –

回答

0

嘗試這樣

<head> 
 
    <meta charset="utf-8"> 
 
    <title>Users</title> 
 
    <link rel="stylesheet" href="bootstrap.css"> 
 
    <link rel="stylesheet" href="bootstrap.min.css"> 
 
    
 
    <!-- my style sheet --> 
 
    <link rel="stylesheet" href="style.css"> 
 
</head>

0

有遺漏碼的前fiedset標籤:

<!DOCTYPE html> 
    <html> 
    <head> 
     <meta charset="utf-8"> 
     <link rel="stylesheet" href="style.css"> 
     <link rel="stylesheet" href="bootstrap.css"> 
    <link rel="stylesheet" href="bootstrap.min.css"> 
    <title>Users</title> 
</head> 
<body> 

    <form class="form-horizontal col-lg-7" style="border: 1px solid red;" action="/index.php"> 
    <div class="row"> 
      <div class="col-bs-6"> 
      <div class="well bs-component"> 
       <form class="form-horizontal"> 
    <fieldset> 
     <div class="form-group"> 
     <label for="inputUsername" class="col-lg-3 control-label">Username</label> 
     <div class="col-lg-3"> 
      <input type="text" class="form-control" id="inputUsername" placeholder="Enter Username"> 
     </div> 
     </div> 

     <div class="form-group"> 
     <label for="inputPassword" class="col-lg-3 control-label">Password</label> 
     <div class="col-lg-3"> 
      <input type="password" class="form-control" id="inputPassword" placeholder="Password"> 
     </div> 
     </div> 
     <div class="form-group"> 
     <div class="col-lg-10 col-lg-offset-3"> 
      <button type="reset" class="btn btn-default">Reset </button> 
      <button type="submit" class="btn btn-primary">Login </button> 
     </div> 
     </div> 
    </fieldset> 
    </div> 
    </div> 
    </div> 
    </form> 
    </body> 
</html>