ブートストラップを使用しているときにdjangoが白いライトを表示するのはなぜですか？

htmlファイルをレンダリングすると、ページの上に表示したいのですが、djangoは白い線を上に表示します。これは、それがどのように見えるかです：ブートストラップを使用しているときにdjangoが白いライトを表示するのはなぜですか？

私はオレンジ色にするために、ページの最上部から、すべてをしたい、とページの一番上にその白い線を持っていません。どうやってするか？

これは私のhtmlコードです：

{% load staticfiles %} 
<!DOCTYPE html> 

<html lang="en"> 
<head> 

    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 

    <title>{% block title %}{% endblock %}</title> 

    <!-- jQuery library --> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    <!-- Latest compiled JavaScript --> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 

    <!-- Custom Fonts --> 
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" /> 
    <link href='https://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic' rel='stylesheet' type='text/css'> 
    <link href='https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800' rel='stylesheet' type='text/css'> 

    <link href="{% static "css/blog.css" %}" rel="stylesheet" type="text/css" /> 

    <!-- Theme CSS --> 

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --> 
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> 
    <!--[if lt IE 9]> 
     <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> 
     <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script> 
    <![endif]--> 

</head> 

<body><!-- Navigation --> 
    <!-- Page Header --> 
    <!-- Set your background image for this header on the line below. --> 

    <div class="page-header"> 
     <h1>My First Bootstrap Page</h1> 
     <p>Resize this responsive page to see the effect!</p> 
    </div> 

    <!-- Main Content --> 
    <div class="container"> 
     <div class="row"> 
      <div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1"> 
       {% block content %} 
       {% endblock %} 
      </div> 
     </div> 
    </div> 
</body> 
</html>

私のCSSファイル：

.page-header { 
    background-color: #ff9400; 
    margin-top: 0; 
    padding-top: 0; 
    padding: 20px 20px 20px 40px; 
}

私はちょうどそれが正常に見えるのブラウザでそれを開くために私のhtmlファイルをダブルクリックすると、私は起動時に私のサーバーdjangoを介して、それは良く見えません。ご協力ありがとうございました。

出典

2016-11-06 P3P5

Djangoはこれはジャンゴとは何の関係もありませんトップ

に白い線が表示されます。それはCSSの問題です。

あなたは、この書いた：最後の行が20ピクセルでパディングトップを上書き

.page-header { 
    background-color: #ff9400; 
    margin-top: 0; 
    padding-top: 0; 
    padding: 20px 20px 20px 40px; 
}

を。

私はちょうどブラウザで開き、私のhtmlファイルをダブルクリックすることは正常に見えるが、私はジャンゴを経由して自分のサーバーを起動するとき、それは見ていません

.page-header { 
    background-color: #ff9400; 
    margin-top: 0; 
    padding: 0 20px 20px 40px; 
}

：であなたのCSSを交換してください良い

おそらく、HTMLファイルを開いたときにカスタムCSSが読み込まれないためです。あなたのブラウザは{% static "css/blog.css" %}を読み取ることができません。

出典

2016-11-06 12:44:54

ありがとうございました。 – P3P5

ブートストラップを使用しているときにdjangoが白いライトを表示するのはなぜですか？

答えて

関連する問題