创新互联Foundation教程:Foundation顶部导航栏

Foundation 顶部导航栏

顶部导航栏放在页面头部:

专注于为中小企业提供网站设计、网站制作服务,电脑端+手机端+微信端的三站合一,更高效的管理,为中小企业宽甸免费做网站提供优质的服务。我们立足成都,凝聚了一批互联网行业人才,有力地推动了千余家企业的稳健成长,帮助中小企业通过网站建设实现规模扩充和转变。

实例

<
nav
class=
"top-bar"
data-topbar
>

 
<
ul
class=
"title-area"
>

   
<
li
class=
"name"
>

     


     
<
h1
>
<
a
href=
"#"
>WebSiteName
<
/a
>
<
/h1
>

   
<
/li
>

     


   
<
li
class=
"toggle-topbar menu-icon"
>
<
a
href=
"#"
>
<
span
>Menu
<
/span
>
<
/a
>
<
/li
>

 
<
/ul
>

 
<
section
class=
"top-bar-section"
>

   
<
ul
class=
"left"
>

     
<
li
class=
"active"
>
<
a
href=
"#"
>Home
<
/a
>
<
/li
>

     
<
li
>
<
a
href=
"#"
>Page 1
<
/a
>
<
/li
>

     
<
li
>
<
a
href=
"#"
>Page 2
<
/a
>
<
/li
>

     
<
li
>
<
a
href=
"#"
>Page 3
<
/a
>
<
/li
>

   
<
/ul
>

 
<
/section
>


<
/nav
>




<
script
>

$(document).ready(function() {

    $(document).foundation();

})


<
/script
>

尝试一下 »

实例解析

使用