上面是一個簡單的HTML5橫向?qū)Ш讲藛未a,使用了nav和a標(biāo)簽實現(xiàn)。其中,nav標(biāo)簽用于包含整個導(dǎo)航欄,a標(biāo)簽用于包含具體的鏈接。代碼中還有一些樣式,可以自行調(diào)整。
``` nav { background-color: #333; display: flex; /* 按照水平方向排列 */ justify-content: space-between; /* 相當(dāng)于 float:left 和 float:right */ padding: 20px; } nav a { color: white; text-decoration: none; /* 去掉下劃線 */ font-size: 18px; margin-right: 20px; /* 間隔 */ } nav a:hover { color: yellow; } ```
如果想要添加更多的鏈接,只需要在nav標(biāo)簽內(nèi)添加更多的a標(biāo)簽即可。
這種導(dǎo)航欄的好處是,可以很好地適應(yīng)不同大小的屏幕,而且看上去很美觀。同時,使用HTML5語義化標(biāo)簽,讓網(wǎng)頁的結(jié)構(gòu)更加清晰。