Fullpage.js nicht am oberen Bildschirmrand

Ich habe ein Problem mit Vollbild-js.Fullpage.js nicht am oberen Bildschirmrand

Das Problem ist, dass die blattgr nicht am oberen Rand des Bildschirms ist:

Das ist mein HTML (Im mit Django):

{% extends 'layout/app.html' %} 


    <body> 
     {% block content %} 
     <div id="fullpage"> 
       <div class="section" id="section1">Some section</div> 
       <div class="section">Some section</div> 
       <div class="section">Some section</div> 
       <div class="section">Some section</div> 
      </div> 

     {% endblock %} 
    </body>

Die base.html wo index.html erweitert von:

{% load static %} 
<!DOCTYPE html> 
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta charset="utf-8" /> 
    <link rel="stylesheet" type="text/css" href="{% static 'Portfolio/css/normalize/normalize.css' %}" /> 

    <link rel="stylesheet" type="text/css" href="{% static 'Portfolio/css/fullpage/jquery.fullPage.css' %}" /> 
    <link rel="stylesheet" type="text/css" href="{% static 'Portfolio/css/bootstrap/bootstrap.css' %}" /> 
    <link rel="stylesheet" type="text/css" href="{% static 'Portfolio/css/style.css' %}" /> 
    <title></title> 

</head> 
<body> 
    {% block navbar %} 
    {% endblock %} 
    {% block content %} 
    {% endblock %} 
    <script src="{% static 'Portfolio/js/bootstrap/bootstrap.min.js' %}"></script> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script> 
    <script src="{% static 'Portfolio/js/fullpage/jquery.fullPage.min.js' %}"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $('#fullpage').fullpage({ 
       //sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE', 'whitesmoke', '#ccddff'], 
       anchors: ['Welcome', 'Portfolio', 'Skills', 'About', 'Contact'], 


    menu: '#menu', 
      scrollingSpeed: 1000 
     }); 

    }); 
</script> 
</body> 
</html>

Und das ist die CSS:

#section1 { 
    background-image: url(../images/bg.png); 
    background-size: cover; 
}

Ich habe versucht Einstellung margin : 0 ich habe auch normalize.css verknüpft.

So gibt es keinen Rand oder Padding auf die ganze Seite und auf den Körper angewendet. Was kann dieses Problem verursachen?

EDIT:

Die navbar leer ist und ich versuchte es app.html entfernen, es hat nicht funktioniert.

EDIT:

alles in einer HTML-Dateien Putting behebt das Problem. Dies bedeutet wahrscheinlich, dass es etwas mit Djangos Templating Engine zu tun hat. Aber was kann es sein?

Quelle

2017-09-20 Jurriaan Buitenweg

Sie Navigationsleiste, ist es leer? – M0ns1f

Was ich empfehlen würde, ist die Verwendung der Maus, um das Element auf der gerenderten Seite zu wählen, indem (1) Chrome-Dev-Tools mit der 'f12'-Taste geöffnet werden. (2) Wählen Sie das Elementauswahl-Werkzeug, indem Sie gleichzeitig "Strg + Umschalt + C" drücken. (3) Bewegen Sie den Mauszeiger über den weißen Bereich oben und klicken Sie auf. (4) füge einen Screenshot dazu zu deiner Frage hinzu. Das wäre eine große Hilfe. – JaeGeeTee

@ M0ns1f Ja, es ist –

Ich habe das Problem gefunden, Es gab eine keine Pause Raum Charakter zum Körper hinzugefügt, Ändern der Codierung zu ANSII gearbeitet.

Quelle

2017-09-22 07:04:41

Fullpage.js nicht am oberen Bildschirmrand

Antwort

Verwandte Themen