導航條是一個網站中必不可少的元素,那麼如何用HTML和CSS製作一個導航條呢?下面小編給大家分享一下。
工具/材料
Sublime Text
操作方法
首先開啟Sublime Text軟件,新建一個html頁面,並且在html頁面中準備好html結構,如下圖所示
接下來我們在html的body結構裏添加導航條的內容,如下圖所示
然後就需要在style標籤中用CSS對導航條的樣式進行定義了,如下圖所示,書寫樣式的時候一定要注意寫在style標籤裏面
最後執行html頁面,你就會看到如下圖所示的導航條,當鼠標放在某個導航上時,背景色會變成紅色