一行
<span>
标签实现一个小图标,更可以与<a>
标签搭配形成导航栏(灵感来源于OneDIV网站)。
源码放在Github:https://github.com/Monkey626/...
Code
默认效果
<span class="icon-name"></span>
与
<a>
标签搭配
<div class="menu">
<span class="icon-name"></span>
<a href="">nav-name</a>
</div>
Example
默认效果
<span class="mail"></span>
导航栏菜单效果
<div class="menu">
<span class="ribbon"></span>
<a href="">Ribbon</a>
</div>
Wifi
默认效果
<span class="wifi"></span>
导航栏菜单效果
<div class="menu">
<span class="wifi"></span>
<a href="">Wifi</a>
</div>
Eye
默认效果
<span class="eye"></span>
导航栏菜单效果
<div class="menu">
<span class="eye"></span>
<a href="">Eye</a>
</div>
Ribbon
默认效果
<span class="ribbon"></span>
导航栏菜单效果
<div class="menu">
<span class="ribbon"></span>
<a href="">Ribbon</a>
</div>
Arrow-left
默认效果
<span class="arrow-left"></span>
导航栏菜单效果
<div class="menu">
<span class="arrow-left"></span>
<a href="">Arrow-left</a>
</div>
Arrow-right
默认效果
<span class="arrow-right"></span>
导航栏菜单效果
<div class="menu">
<span class="arrow-right"></span>
<a href="">Arrow-right</a>
</div>
Arrow-top
默认效果
<span class="arrow-top"></span>
导航栏菜单效果
<div class="menu">
<span class="arrow-top"></span>
<a href="">Arrow-top</a>
</div>
Arrow-down
默认效果
<span class="arrow-down"></span>
导航栏菜单效果
<div class="menu">
<span class="arrow-down"></span>
<a href="">Arrow-down</a>
</div>
Search
默认效果
<span class="search"></span>
导航栏菜单效果
<div class="menu">
<span class="search"></span>
<a href="">Search</a>
</div>
OK
默认效果
<span class="ok"></span>
导航栏菜单效果
<div class="menu">
<span class="ok"></span>
<a href="">OK</a>
</div>
Remove
默认效果
<span class="remove"></span>
导航栏菜单效果
<div class="menu">
<span class="remove"></span>
<a href="">Remove</a>
</div>
Th-large
默认效果
<span class="th-large"></span>
导航栏菜单效果
<div class="menu">
<span class="th-large"></span>
<a href="">Th-large</a>
</div>
Th
默认效果
<span class="th"></span>
导航栏菜单效果
<div class="menu">
<span class="th"></span>
<a href="">Th</a>
</div>
Th-list
默认效果
<span class="th-list"></span>
导航栏菜单效果
<div class="menu">
<span class="th-list"></span>
<a href="">Th-list</a>
</div>
Clock
默认效果
<span class="clock"></span>
导航栏菜单效果
<div class="menu">
<span class="clock"></span>
<a href="">Clock</a>
</div>
Blackboard
默认效果
<span class="blackboard"></span>
导航栏菜单效果
<div class="menu">
<span class="blackboard"></span>
<a href="">Blackboard</a>
</div>
Calendar
默认效果
<span class="calendar"></span>
导航栏菜单效果
<div class="menu">
<span class="calendar"></span>
<a href="">Calendar</a>
</div>
Smile
默认效果
<span class="smile"></span>
导航栏菜单效果
<div class="menu">
<span class="smile"></span>
<a href="">Smile</a>
</div>
Loader
默认效果
<span class="loader"></span>
导航栏菜单效果
<div class="menu">
<span class="loader"></span>
<a href="">Loader</a>
</div>
Loader-animated
默认效果
<span class="loader-animated"></span>
导航栏菜单效果
<div class="menu">
<span class="loader-animated"></span>
<a href="">Loader-animated</a>
</div>