|
Faites votre propre barre de navigation horizontale , ou « barre de navigation », avec des lignes de code html . Html et CSS est tapé dans un éditeur de texte tel que Notepad , où l'information comme du texte , la couleur et les liens sont entrés dans le code. Une fois que vous avez ajouté le code de votre site web, vos lecteurs ont les outils pour visiter les autres pages de votre site. Instructions
1 Ouvrez le programme Bloc-notes
2 créer les différents liens pour votre barre de navigation et le rembourrage et la marge pour elle par copier-coller le texte suivant dans votre bloc-notes. : Photos - href Home < /a> < /li>
- < , a href = " #" > Qui sommes-nous < /li>
- href services
< li> href produits < /li> - href contact < /a> < /li>
Photos ul # list -nav {margin: 20px; padding: 0; list-style : none; width: 525px ;}
3 Faire la barre de navigation aller dans une ligne à travers la page web en copiant et collant les éléments suivants dans votre agenda :
ul # list -nav li {display : inline }
4 Créer des liens pour la barre de navigation en copiant et collant les éléments suivants:
ul # list -nav li a { text-decoration : none; padding: 5px 0; width: 100px ; background: # 485e49 ; color: # eee ; float: gauche ;
5 aligner le texte dans la barre de navigation en copiant et collant les éléments suivants:
ul # list -nav li a {text -align : center; border-left : 1px solid # fff ;}
6 créer une couleur de refinancement en copiant et collant le suivant :
ul # list -nav li a: hover {background: # a2b3a1 ; color: # 000 }
7 Changez toutes les couleurs en tapant le code de la couleur de votre choix . Trouver tous les symboles "#" et les remplacer par des adresses URL pour créer les liens pour " Home", "About Us ", " services ", " produits " et "Contact " . ;
8 Enregistrez le fichier de code barre de navigation à votre bloc-notes. Appuyez sur "Ctrl" + "A" pour sélectionner tous. Ouvrez votre page Web et accédez à l'éditeur HTML CSS. Appuyez sur "Ctrl" + "V" pour copier le code barre de navigation . Enregistrez le code à saisir dans votre page Web.
|
