財団のサイドバー
サイドバーナビゲーション
財団の使用<ul class="side-nav"> ">サイドバーを作成します。
例
<ULクラス= "サイド-NAV ">
<李> <aのHREF = "#">リンク1 </ A> </ LI>
<李> <aのHREF = "#">リンク2 </ A> </ LI>
<李> <aのHREF = "#">リンク3 </ A> </ LI>
<李> <aのHREF = "#">リンク4 </ A> </ LI>
</ UL>
<李> <aのHREF = "#">リンク1 </ A> </ LI>
<李> <aのHREF = "#">リンク2 </ A> </ LI>
<李> <aのHREF = "#">リンク3 </ A> </ LI>
<李> <aのHREF = "#">リンク4 </ A> </ LI>
</ UL>
»をお試しください
分割線とのアクティベーションリンク
私は内のリンクをクリックした<li>使用.active用いて同定されたクラス.divider水平線を追加するクラス：
例
<ULクラス= "サイド-NAV ">
<李クラス= "アクティブ"> <aクラス= "a"のhref = "#">リンク1 </ A> </ LI>
<李> <aクラス= "a"のhref = "#">リンク2 </ A> </ LI>
<李クラス= "分周器"> </ LI>
<李> <aクラス= "a"のhref = "#">リンク3 </ A> </ LI>
<李> <aクラス= "a"のhref = "#">リンク4 </ A> </ LI>
</ UL>
<李クラス= "アクティブ"> <aクラス= "a"のhref = "#">リンク1 </ A> </ LI>
<李> <aクラス= "a"のhref = "#">リンク2 </ A> </ LI>
<李クラス= "分周器"> </ LI>
<李> <aクラス= "a"のhref = "#">リンク3 </ A> </ LI>
<李> <aクラス= "a"のhref = "#">リンク4 </ A> </ LI>
</ UL>
»をお試しください
グリッドサイドバー
私たちは、次のような例は、サイド・ナビゲーション・バーを設定するために、グリッドのデザインモードを使用することができます。
例
<DIVクラス = "行">
<DIVクラスは=「中4列"スタイル="背景色：＃のf1f1f1; ">
<ULクラス= "サイド-NAV ">
<李クラス= "アクティブ"> <aのHREF = "#">ホーム</ A> </ LI>
<李> <aのHREF = "#">学びHTMLの</ A> </ LI>
...
</ UL>
</ DIV>
<DIVクラス=「中8列">
<H1>サイドナビゲーション</ H1 >
<P>一部のテキスト.. </ P>
...
</ DIV>
</ DIV>
<DIVクラスは=「中4列"スタイル="背景色：＃のf1f1f1; ">
<ULクラス= "サイド-NAV ">
<李クラス= "アクティブ"> <aのHREF = "#">ホーム</ A> </ LI>
<李> <aのHREF = "#">学びHTMLの</ A> </ LI>
...
</ UL>
</ DIV>
<DIVクラス=「中8列">
<H1>サイドナビゲーション</ H1 >
<P>一部のテキスト.. </ P>
...
</ DIV>
</ DIV>
»をお試しください