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