如何利用html製作網頁水平導航選單?
來源:酷知科普網 1.82W
我們在利用html進行網站製作時,網站頭部的水平導航選單通常是必不可少的,許多初識html的小夥伴對於如何建立水平選單可能有些疑惑,諸如:如何設定CSS樣式達到自己想要的效果。接下來,我就為大家簡單介紹一下。
操作方法
(01)使用<ul>標籤書寫將用於建立導航選單的主題內容,並使用<a>標籤為每個導航欄目設定對應的連結地址(我這裡使用“#”代替連結地址)。詳細的程式碼如下圖所示。
(02)為第一步驟寫好的主體內容設定CSS樣式。詳細CSS樣式如下圖所示:
(03)將整體程式碼以""或""的文件格式儲存,並使用瀏覽器開啟。
特別提示
一定要在標籤中宣告文件的編碼格式,不然使用瀏覽器開啟之後可能會出現亂碼。
注意一定要對"li"設定“display:inline”這樣選單才會顯示為水平選單。
注意對導航欄目設定水平居中和垂直居中。