實現(xiàn)這個功能有很多種方法，這里我選一種個人認為比較簡單的方法建立三個網頁，一個作為主頁面，另外兩個子頁面作為切換頁面嵌入主頁面，子頁面也可以用文字替代用jQuery方法來切換頁面，語言比較簡單網上搜一下看看就懂了 下面附上代碼 lt！DOCTYPE htmllthtmllthead ltmeta charset=quotUTF8quot；一直以來，我們習慣于使用形如ltdiv id=quotnavquot或ltul id=quotnavquot這樣的代碼來寫頁面的導航在HTML5中，我們可以直接將導航鏈接列表放到ltnav標簽中l(wèi)tnav ltul ltlilta href=quotindexhtmlquotHomeltaltli ltlilta href=quotaboutquotAboutltaltli ltlilta href=quotblogquotBloglt；只需要做好樣式，隱藏顯示就好了；Nav元素可以用作頁面導航的鏈接組，在導航鏈接組里面有很多的鏈接，點擊每個鏈接可以鏈接到其他頁面或者當前頁面的其他部分，并不是所有的鏈接組都要被放在nav元素里面，我們只需要把最主要的基本的重要的放在nav元素里面即可；HTML5讓導航欄固定頂部不動且不遮擋住下面的DIV方法如下1，首先在html中，添加良好的導航內容2，后者是網頁的具體內容，這里的代碼比較簡單3，在樣式中，首先在菜單中定義一些樣式4，此時，在運行頁面時，滾動條滾動后導航將消失5，為了將導航欄固定在頂部，可以添加樣式位置固定最高0。

可以通過更改#document片段的CSS來實現(xiàn)這一點，這些是DOM1規(guī)范，所有瀏覽器都支持以下解決方案是特定于webkit的 videowebkitmediacontrolsfullscreenbutton display videowebkitmediacontrolsplaybutton videowebkitmediacontrolstimeline videowebkitmedia；建議使用FF，Safari，舉個例子lt！doctype html lthtml lthead lttitleHTML5+CSS3+JavaScriptlttitle ltmeta；二語義元素類型 HTML5引入了一系列語義元素，包括header頭部信息footer底部信息nav導航欄article文章內容塊section區(qū)域分隔符aside邊緣內容details詳細內容信息塊figure帶圖形信息的圖文單元等這些元素能夠幫助開發(fā)者更清晰準確地描述頁面結構和內容含義。

事實上，底部導航的廣泛應用不是在pc端，而是在移動端 在pc中，底部導航通常采用固定的方式這種導航可以降低用戶的成本，但是對于結構復雜的網站，二級或者三級導航的網站就不太適合了其次，把導航放在底部，對于用戶的使用習慣來說不是特別好用戶的眼睛從上到下從做到右瀏覽這種設計挑戰(zhàn)了用戶的使用習慣 所以；在HTML5頁面中，經常使用ltnav標簽來充當導航的結構化標簽ltnav標簽用于定義頁面的導航部分，通常包含導航鏈接或導航菜單它提供了一種語義化的方式來標記頁面的導航內容，使得搜索引擎和輔助技術能夠更好地理解和處理導航部分的內容示例代碼htmlCopy codeltnav ltul ltlilta href=quot#quot首頁lt；HTML5怎么把導航固定在底部的步驟如下css的定位樣式屬性來實現(xiàn)會用到css中的positionfixed屬性，結合來實現(xiàn)ltstylefootmenuwidth100%height60pxbackground#000positionfixedbottom0**距離底部為0*left0zindex1ltstyleltdiv class=quotfootmenuquotlt！導航具體。

3 橫向滑動的列表導航lt 將垂直布局變?yōu)闄M向，分類展示，既方便查看又展示更多信息，但也考驗了內容的組織和用戶操作習慣列表導航的進化lt 加入了功能按鈕或滑動選項，空間利用更佳，但過多重復的功能可能會讓用戶感到困惑5 底部TabBarlt 固定在底部的標志性導航，直觀易找，利于快速切換，但內容；如何設置html導航欄1用Dreamweaver創(chuàng)建一個新的HTML文件2先按ctrls保存，以防突然斷電，數(shù)據(jù)丟失3將title修改為htmlcss，實現(xiàn)橫向導航4創(chuàng)建一個新的divid“A”并添加ulli標簽5在li中添加所需的文本，并調整文本間距按F12預覽，如下圖所示6首先去掉字體前面的小黑點代碼如下7。

設置固定定位，定位到窗口頂部HTMLltdiv id=quotfixquot這是一個固定定位的divltdiv CSSfixposition fixed background blackcolor #fff。

html5 導航路線效果調用核心代碼ltscript type=quottextjavascriptquot 默認地理位置設置為上海市浦東新區(qū)var x=12149，y=3171 windowonload = function ifnavigatorgeolocation showPosition documentgetElementByIdquotst。