- 相關(guān)推薦
網(wǎng)頁設(shè)計制作教程《三》
網(wǎng)頁設(shè)計制作教程《三》
導(dǎo)航
工具/原料
photoshop
dreamweaver
步驟/方法
1
編寫一個導(dǎo)航的div
2
編寫導(dǎo)航中的欄目，這里用列表
3
這樣，html就編寫好了...下面我們對給html設(shè)置樣式，具體編寫位置以及全局簡介看網(wǎng)頁設(shè)計制作教程《一，二》
4
給導(dǎo)航一個寬度，并且讓導(dǎo)航居中顯示，并且給導(dǎo)航一個#ccc的背景色
5
所有的列表設(shè)置一個高度
6
導(dǎo)航的所有列表，在一條線上排列
7
對列表中的每一個欄目進行css樣式設(shè)定：塊狀，寬度100，高度40，行高40，左浮動，文字居中顯示，文字下劃線沒有，背景#ddd，左邊距6px，字體大小14，顏色#666
8
設(shè)置鼠標(biāo)經(jīng)過欄目的css樣式
9
這樣，一個導(dǎo)航就編寫好了
注意事項
.nav ul li{ display:inline;}必須要，要不然.nav ul li a 浮動過之后不會在一條線上...
【網(wǎng)頁設(shè)計制作教程《三》】相關(guān)文章：
網(wǎng)頁設(shè)計與制作報告01-04
網(wǎng)頁設(shè)計與制作心得12-12