【ナビを簡単に設置する方法】

ぜひコピペしてお使いください😁

（htmlコーディング）************************************************************

<ul id=”globalNavi”>
<li><a href=”/” >HOME</a></li>
<li><a href=”/guidance/”>お仕事の内容</a></li>
<li><a href=”/work/”>お仕事の流れ</a></li>
<li><a href=”/reference/”>サポート体制</a></li>
<li><a href=”/voice/”>女の子の声</a></li>
<li><a href=”/faq/”>よくあるご質問</a></li>
<li><a href=”/com/”>会社概要</a></li>
</ul>

（cssサンプル）************************************************************

#headerArea #globalNavi {
width: 962px;
height: 47px;
position: absolute;
top: 112px;
background-image: url(../iimg/gnavi.jpg);
}
#headerArea #globalNavi li, #headerArea #globalNavi li a {
height: 46px;
}
#headerArea #globalNavi li {
float: left;
display:inline;
}
#headerArea #globalNavi li a {
display:inline-block;/*ieHack*/
overflow:hidden;
text-indent:-9999px;
}
#headerArea #globalNavi li a {
display:block;
}
#headerArea #globalNavi li a.active, #headerArea #globalNavi li a:hover {
background-image: url(../iimg/gnavi.jpg);
}
#headerArea #globalNavi .m1, #headerArea #globalNavi .m1 a {
width:86px;
}
#headerArea #globalNavi .m2, #headerArea #globalNavi .m2 a {
width:145px;
}
#headerArea #globalNavi .m3, #headerArea #globalNavi .m3 a {
width:146px;
}
#headerArea #globalNavi .m4, #headerArea #globalNavi .m4 a {
width:145px;
}
#headerArea #globalNavi .m5, #headerArea #globalNavi .m5 a {
width:146px;
}
#headerArea #globalNavi .m6, #headerArea #globalNavi .m6 a {
width:146px;
}
#headerArea #globalNavi .m7, #headerArea #globalNavi .m7 a {
width:148px;
}
#headerArea #globalNavi .m1 a:hover {
background-position:0px -46px;
}
#headerArea #globalNavi .m2 a:hover {
background-position:-86px -46px;
}
#headerArea #globalNavi .m3 a:hover {
background-position:-231px -46px;
}
#headerArea #globalNavi .m4 a:hover {
background-position:-377px -46px;
}
#headerArea #globalNavi .m5 a:hover {
background-position:-522px -46px;
}
#headerArea #globalNavi .m6 a:hover {
background-position:-668px -46px;
}
#headerArea #globalNavi .m7 a:hover {
background-position:-814px -46px;
}
#headerArea #globalNavi .m1 a.active {
background-position:0px -92px;
}
#headerArea #globalNavi .m2 a.active {
background-position:-86px -106px;
}
#headerArea #globalNavi .m3 a.active {
background-position:-231px -92px;
}
#headerArea #globalNavi .m4 a.active {
background-position:-377px -92px;
}
#headerArea #globalNavi .m5 a.active {
background-position:-522px -926px;
}
#headerArea #globalNavi .m6 a.active {
background-position:-668px -92px;
}
#headerArea #globalNavi .m7 a.active {
background-position:-814px -92px;
}