在網路上搜尋了一下都沒怎麼看到純用CSS製作標籤導航方面的教學或說明,大部分都是要涉及到JS的編寫的。這對許多CSS學習中的人來說實在有些不夠體貼,既然沒人做那我來先試試!我在這裡做的CSS標籤導航是純CSS無JS無背景圖片的綠色導航。此文章適合初學者,高手可以路過,呵呵!
其實這其中的關鍵點是ul中的position:absolute指令,由於使用了這個CSS屬性,ul導航的內容變成了層顯示,就等於浮在了瀏覽器上面。而為了不讓下面的內容填補ul部分的內容,在ul外還套了個div,起到了幫助ul佔位的作用。而這個div也同時起到了充當ul背景的作用,標籤導航的關鍵就是底部border了。全看完之後你會發現其實很簡單,但關鍵還是要有構思。好了!繼續學習吧!