color : couleur // background : arrière-plan // font-size :
taille de police // text-align : alignement du texte //
margin : marge // padding : remplissage // border : (<!DOCTYPE html>) (<html lang="en">) (<head>) (<meta
bordure // width : largeur // height : hauteur // display :
charset="UTF-8">) (<meta name="viewport"
affichage // position : position // top, right, bottom, left :
content="width=device-width, initial-scale=1.0">)
haut, droite, bas, gauche // z-index : index z // float :
(<title>Document</title>) (<link rel="stylesheet"
flottant // clear : dégagement // font-family : famille de
police // font-weight : épaisseur de police // line-height : href="[Link]">) (</head>) (<body>) (<header>) (<a
hauteur de ligne // letter-spacing : espacement des lettres href="#" class="logo">nilson</a>) (<nav
// text-decoration : décoration du texte // text-transform : class="navigation">) (<ul class="nav-links">) (<li
transformation du texte // Bordures et arrière-plans // class="nav-link"><a href="#">home</a></li>) (<li
border-radius : arrondi des bordures // box-shadow : class="nav-link"><a href="#">contact</a>) (<ul
ombre de la boîte // background-color : couleur d'arrière- class="drop-dawn">) (<li><a href="#">contact1</a></li>)
plan // background-image : image d'arrière-plan // (<li><a href="#">contact2</a></li>) (<li><a
display: flex : affichage flex // justify-content : alignement href="#">contact3</a></li>) (</ul>) (</li>) (<li class="nav-
horizontal (justifier le contenu) // align-items : alignement link"><a href="#">services</a>) (<ul class="drop-dawn">)
vertical // flex-direction : direction des elements
(<li><a href="#">services1</a></li>) (<li><a
href="#">services2</a></li>) (<li><a
href="#">services3</a></li>) (</ul>) (</li>) (<li class="nav-
link"><a href="#">about us</a>) (<ul class="drop-down">)
(<li><a href="#">about1</a></li>) (<li><a
href="#">about1</a></li>) (<li><a
href="#">about1</a></li>) (</ul>) (</li>) (</ul>) (</nav>)
(</header>) (</body>) (</html>)
(/* General Reset / * { margin: 0; padding: 0; box-sizing:
border-box;} body {font-family: Arial, sans-serif;line-height:
1.6;} header { background-color: #333; color: #fff; padding:
10px 20px; display: flex; justify-content: space-between;
align-items: center;} header .logo { font-size: 24px; font-
weight: bold; text-decoration: none; color: #fff;} /
Navigation Styling / .nav-links {list-style: none;display:
flex;gap: 20px;} .nav-link {position: relative;} .nav-link a {
text-decoration: none; color: #fff; padding: 10px; display:
block;} .nav-link a:hover { background-color: #555; border-
radius: 4px;} / Dropdown Menu Styling */ .drop-
dawn, .drop-down { display: none; position: absolute; top:
100%; left: 0; background-color: #444; list-style: none;
padding: 10px 0; min-width: 150px;border-radius: 4px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);} .drop-dawn li
{padding: 5px 10px;} .drop-dawn li a { color: #fff;text-
decoration: none; display: block;} .drop-dawn li
a:hover{ background-color: #555; border-radius: 4px;}
.nav-link:hover .drop-dawn{ display: block;})