Création d' un modèle HTML vous permet de construire rapidement les futures pages d'un site web . Copiez le code du modèle et le coller dans l'éditeur pour créer une nouvelle page. En utilisant divs signifie que vous pouvez facilement modifier la mise en page de votre site en éditant un seul fichier : le fichier CSS, qui contrôle la disposition des divs à travers l'ensemble du site . Choses que vous devez
HTML /CSS éditeur de votre choix
Afficher plus Instructions
1
Créer un fichier HTML dans l'éditeur de votre choix .
< Br > 2
Insérez le code HTML suivant, qui crée la structure de votre page et inclut un lien vers le fichier CSS. (Le fichier CSS sera créé à un stade ultérieur . )
Layout 1
Photos < p>
Photos
Photos
Ajouter un titre de votre choix pour remplacer le texte " Layout 1 " .
3
Ajouter les " div " suivant entre les balises "
" .
id="navigation">
Navigation
Photos < p>
Photos
Il s'agit d'une disposition typique d'une page web. La " tête" se réfère à la partie supérieure de la page, le menu se trouve en dessous. Le contenu principal de chaque page va dans la section "Contenu" et la section " Pied de page " abrite généralement le menu du bas sur une page web. Chaque section possède un identifiant qui est utilisé par le fichier CSS de se référer à chaque élément et le placer dans la section appropriée de la page.
4
enregistrer la page. ( Assurez-vous qu'elle est enregistrée dans un fichier " . Html" ).
5
Créer un nouveau fichier " . Css" .
6
Insérez le code de l'aménagement de l' ensemble document, puis ajouter et de manipuler la police et la couleur d'arrière-plan en utilisant le code suivant :
* {
de marge
: 0;
padding: 0;
< p >}
body {
background: # eeeeee ;
font-family: sans-serif;
font-size: 12px ;
}
7
Ajoutez le style de l'en-tête div , qui va définir la taille et la couleur :
div # header {
hauteur de
: 160px ; Photos
background: # 800000 ; }
8
définir le style des autres éléments div de la page: la "navigation" , le "contenu" et le " footer ":
div # navigation {
fond: blanc ;
largeur de
: 25%;
float: left;
< p> }
div # content {
marge
: 0 25 % ;
background: # BDBD00 ;
}
div # footer {
background: # 800000 ;
largeur de
: 100%;
clair : left; }
9 < p > Enregistrer le fichier sous " MyName.css " .
10
Testez la page dans un navigateur en ouvrant la page HTML que vous venez de créer . Copiez le code HTML et ajoutez du contenu applicable à créer chaque nouvelle page de votre site.
