abstrakt：導(dǎo)航只是個(gè)簡(jiǎn)單的樣式?jīng)]有利用font awesome 就算利用也這里卡不到效果，但是明白了其使用的原理。<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>導(dǎo)航制作</title>&l
導(dǎo)航只是個(gè)簡(jiǎn)單的樣式?jīng)]有利用font awesome 就算利用也這里卡不到效果，但是明白了其使用的原理。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>導(dǎo)航制作</title>
<style>
*{padding: 0; margin: 0};
.clear{clear:both;}
a{text-decoration: none; color:#fff;padding-right:15px;}
.header{height:80px ; width:100%; background:#333;}
.nav{width:1600px; height:80px; margin:0 auto; font-size:25px;padding-right:15px;}
.left{ line-height:80px; float: left; }
.right{float: right; line-height:80px;}
.nav a:hover{background:#fff; color: darkorange;}
</style>
<body>
<div class="header">
<div class="nav">
<div class="left">
<a href="">第一個(gè)菜單</a>
<a href="">2個(gè)菜單</a>
<a href="">第三個(gè)</a>
<a href="">四個(gè)菜單</a>
<a href="">五個(gè)</a>
</div>
<div class="right">
<a href="">第er個(gè)菜單</a>
<a href="">2個(gè)菜單</a>
<a href="">第三個(gè)</a>
<a href="">四個(gè)菜單</a>
<a href="">五個(gè)</a>
</div>
<div class="clear"></div>
</div>
</div>
</body>
</html>
Korrigierender Lehrer：滅絕師太Korrekturzeit：2019-03-19 09:05:28
Zusammenfassung des Lehrers：完成的不錯(cuò)!知道原理后面會(huì)使用就可以啦!