經常看到網頁當中，上方一個導航欄，下面有內容，點擊導航欄菜單，就可以改變下方的內容，今天查了查實現方法，本人用的frameset+frame實現的，實現方法簡單，容易理解。廢話不多說，上代碼：
Index.html
1 <html> 2 <head> 3 <title>index</title> 4 </head> 5 <frameset rows="25%,*" frameborder="1"> 6 <frame name="top" src="top.html"> 7 <frame name="botton" src="botton.html"> 8 </frameset> 9 </html>
說明：rows表示你要把網頁上下分欄，cols表示左右分欄，rows后面"25%,*"有兩項表示分成上下兩欄，25%表示上欄占整個網頁的25%，后面的*表示下欄占全部，如果第二個也出現分數，表示下欄占網頁的百分比。這個rows當中只有兩項，表示分兩欄，3項表示分三欄，比如“25%，50%，25%”，以此類推。
frame標簽表示分的欄數，和上面的rows里面的數量對應，分別給分的欄設置一個name，一般為top,botton,left,right,....src表示這一欄當中要顯示的頁面內容。
Top.html
1 <html> 2 <head> 3 <title>top</title> 4 </head> 5 <body> 6 <a href ="1.html" target="botton">1</a><br/> 7 <a href ="2.html" target="botton">2</a><br/> 8 </body> 9 </html>
top.html-------使用a標簽的target屬性，點擊當前鏈接之后，要轉向的欄的名稱，使用botton，因為index。html當中，有name為botton的frame，所以表示點擊1之后，會把1.html當中的內容顯示到名稱為botton的frame當中，由此實現了在上方top當中點擊鏈接，在下方botton當中改變內容。
Botton.html
1 <html> 2 <head> 3 <title>botton</title> 4 </head> 5 <body> 6 show word. 7 </body> 8 </html>
1.html
1 <html> 2 <head> 3 <title>1</title> 4 </head> 5 <body> 6 1 7 </body> 8 </html>
2.html
1 <html> 2 <head> 3 <title>2</title> 4 </head> 5 <body> 6 2 7 </body> 8 </html>