2016-05-27 11 views
1

Ich habe eine externe CSS-Datei namens main.css. Das ID nav, Abschnitt und Fußzeile funktionieren gut, aber die ID-Kopfzeile funktioniert nicht. Wenn ich den Header Teil in HTML-Datei, funktioniert es. Warum funktioniert es nicht in der CSS-Datei?Warum der CSS-Header nicht funktioniert

--------------------------- HTML-Datei ----------------- --------

<!DOCTYPE html> 
<html> 
<head> 
    <link rel="stylesheet" href="main.css"> 
    <meta charset="UTF-8"> 
</head> 

<body> 

    <div id="header"> 
     <h1>Furkan İlhan</h1> 
    </div> 

    <div id="nav"> 
     Hakkında<br> 
     Kariyer<br> 
     Projeler<br> 
     Galeri<br> 
    </div> 

    <div id="section"> 
    <h2>Hakkında</h2> 
    <p>asfsfsdfsdfsdfsdfsdfsfwefsdfsefssdsfsgsgsdsdsdgsdssdsssdmskdfmsldsmdlfskmflsmfsfm, 
    sdfsfsdfsdfsdfsdfsfsefsefsefsefsefsefsefsefsefsefsefsefsef</p> 
    <p>asfsfsdfsdfsdfsdfsdfsfwefsdfsefssdsfsgsgsdsdsdgsdssdsssdmskdfmsldsmdlfskmflsmfsfm, 
    sdfsfsdfsdfsdfsdfsfsefsefsefsefsefsefsefsefsefsefsefsefsef</p> 
    </div> 

    <div id="footer"> 
    Tüm Hakkı Saklıdır. Furkanilhan.com 
    </div> 
</body> 

</html> 

-------------------------- CSS-Datei ------- ------------------------

<style> 

    #header { 
     background-color:black; 
     color:white; 
     text-align:center; 
     padding:5px; 

    } 

    #nav { 
     line-height:30px; 
     background-color:#eeeeee; 
     height:300px; 
     width:100px; 
     float:left; 
     padding:5px;  
    } 

    #section { 
     width:350px; 
     float:left; 
     padding:10px; 
    } 

    #footer { 
     background-color:black; 
     color:white; 
     clear:both; 
     text-align:center; 
     padding:5px; 
    } 
    </style> 

The image of result

+1

Sie haben Header als Klasse definiert und verweisen sie in css mit # header..use .header und es funktioniert –

+0

immer noch nicht funktioniert –

+0

Ist das CSS in der gleichen Datei –

Antwort

2
  1. Dhaval ist falsch - Sie hatte Recht mit der # Header, da Sie es als ID in Ihrem haben HTML.

  2. Entfernen Sie die <style></style> Tags aus Ihrem CSS-Blatt.

Lassen Sie mich wissen, wie Sie

Grüße gehen,
Kostan

+0

Ich habe Style-Tags entfernt und es funktioniert. Vielen Dank. –

+0

Kein Problem, froh, geholfen zu haben :) –

3

Because You-Klasse verwenden = "header" Eigentum und externe CSS-ID # Header definiert.

Sie ändern So

#header {

}

Verwenden Sie diesen Code in CSS

.header {

}

Arbeit 100% Perfekt