header comme facebook avec largeur fixe

Bonjour expert j'essaye de construire une page d'accueil comme facebook. Je veux un en-tête avec une couleur différente avec une largeur fixe avec le navigateur, tout comme la page d'accueil facebook. J'ai créé un ID div avec 100 largeur. Mais la largeur ne correspond pas avec le navigateur. il montre dans le corps. S'il-te-plaît dis moi comment faire ça. Je suis absolument nouveau dans tout cela.header comme facebook avec largeur fixe

Index.html

<html> 
<head> 
<link rel="stylesheet" type="text/css" href="welcome.css"/> 
<title>Welcome To The Thinkers</title> 
</head> 
<body> 
<div class="header"><h1>Welcome To Thinkers</h1></div> 
</body> 
</html>

CSS

body{ 
    background-color:yellow; 
    width:100%; 

} 
p{ 
    font-size:23px; 
    color:#930 
} 
.header{width:100%; 
height:72px; 
background-color:green; 

}

Source

2013-05-09 oyshee

utiliser juste 'la position: fixed' sur votre' .header' CSS - exemple ici - http://jsfiddle.net/3ajjM/ – lifetimes

Il suffit de regarder la barre supérieure du site de stackoverflow. où le nom d'utilisateur seache box a. Je veux construire ce type de barre supérieure. comment faire.? – oyshee

Première: apprendre les bases de html et css. Deuxièmement: apprendre à inspecter le code d'autres sites en utilisant des outils de développement (dans Chrome, ou Firebug dans Firefox). Troisièmement: montrer des efforts au lieu de demander une solution directe. Quatrième: un accueil tardif à stackoverflow.com :) –

Si je vous comprends bien je pense que votre problème est avec marge par défaut/rembourrage sur certains éléments.

Si vous ajoutez

body, h1 
{ 
    margin:0; 
    padding:0; 
}

Il faut régler tout cela.

Demo

Source

2013-05-09 22:05:59 Danield

Essayez ce code:

//these code is for fixed header 
.header{ 
position: fixed; 
top: 0; 
left:0; 
width: 100%; 
background-color: #0683c9; 
}

Source

2015-04-07 17:43:33

header comme facebook avec largeur fixe

Répondre

Questions connexes