CSS代碼如下：
HTML代碼如下：
JS代碼如下：
1. 頁面中的菜單項可以通過嵌套的ul和li來表示；
2. 菜單最外層爲ul，一層每個主菜單放在一個li中，如果有子菜單，在這個主菜單的li中建立新的ul，再依次嵌套即可構建多層的菜單；
3. 瀏覽器中ul和li元素默認情況下文字前都有圓點標識符，li元素會有縮進;
4. list-style屬性值爲none時，可以清除ul和li前面的小圓點;
5. 清除子菜單的縮進值，需要padding和margin都爲0;
6. 可以使用background-image來指定一個元素的背景圖，如果背景圖比元素的實際大小要小，那麼背景圖會自動在橫向和縱向上重複顯示，知道填滿整個區域;
7. 可以使用bakcground-repeat來控制背景圖的重複填充方式;
8. 如果一個元素上同時定義了背景圖和背景色，那麼有背景圖的地方是不會顯示背景色的;
9. text-decoration屬性值爲none時，可以取消文字上的下劃線;
10. background-position可以控制背景圖的位置，屬性值既可以用數值，也可以用center，left,top這些值來控制橫向和縱向的位置。這個屬性的兩個值，第一個對應橫向，第二個對應縱向;
11. background-image的值爲none表示沒有背景圖;
12. background-repeat的值爲no-repeat時，背景圖不會在所在的區域中重複顯示;
13. IE6以外的其他瀏覽器可以通過設定display的值爲block來讓a元素充滿所在的區域。對於IE6，則需要設定display爲inline-block，同時設定a的寬度;
14. display的值爲none可以用於隱藏元素;
15. .main a和.main > a的不同之處，前者選擇使用了.main的這個class的元素內部所有的a節點，後者只選擇.main的子節點中的a節點;
16. show,hide方法可以用於顯示或隱藏元素，沒有參數時的效果和修改css的display屬性效果一樣。參數可以是單位爲毫秒的數字，或者是’slow’,’normal’,’fast’這三個文字，都可以來控制完成顯示或隱藏需要的時間。注意這時動畫效果時靠不斷改變元素的寬度和高度來實現的;
17. toggle方法更爲強大，可以省去我們判斷元素是顯示還是隱藏的狀態，直接讓顯示的元素隱藏起來，隱藏的元素顯示出來。參數使用方法和show，hide相同;
18. slideDown，slideUp可以實現向下或向上捲動的效果，實際上是通過指定時間內修改元素的高度來實現動畫效果。需要注意的是這兩個方法參數爲空的情況和show，hide不同;
19. slideToggle和toggle達到的效果類似;
20. DOCTYPE對於JQuery中的動畫是有影響的。沒有DOCTYPE定義時，在IE中，JQuery的動畫會出現閃爍的糟糕效果;
21. float的值是left，可以使原本各自位於一行的元素全部在一行中向左浮動;
22. 可以給多個選擇器定義同樣的樣式，選擇器之間用,分割。同樣對於JQuery的$方法，也可以傳入過個選擇器
11.