本日は、CSSをつかったメニューの作り方です。
HTMLおよび、CSSは今まで利用の物に追加する形で記述して構いません。
ここからコピー部分です。
***
DIVで囲ったglobal menuを、HTMLのはめたい部分にコピペして下さい。
前回使ったHTMLの
<div id="container">
</div>
この間に入れることが望ましいです。
***コピー開始!(HTML)
<!-- Start header_mainmenu -->
<div id="header_mainmenu">
<ul>
<li>メニュー1</li>
<li>メニュー2</li>
<li>メニュー3</li>
<li>以下、好きなように・・・</li>
</ul>
<!-- End header_mainmenu -->
</div>
****************
***コピー開始!(CSS)
div #header_mainmenu ul li{
width:100%;
display:inline;
text-align:left;
text-decoration:none;
}
*****************
なんと、これだけです。
メニューとしてはこれだけで十分ですね。
以上、本日のテクニックでした^^
HTMLおよび、CSSは今まで利用の物に追加する形で記述して構いません。
ここからコピー部分です。
***
DIVで囲ったglobal menuを、HTMLのはめたい部分にコピペして下さい。
前回使ったHTMLの
<div id="container">
</div>
この間に入れることが望ましいです。
***コピー開始!(HTML)
<!-- Start header_mainmenu -->
<div id="header_mainmenu">
<ul>
<li>メニュー1</li>
<li>メニュー2</li>
<li>メニュー3</li>
<li>以下、好きなように・・・</li>
</ul>
<!-- End header_mainmenu -->
</div>
****************
***コピー開始!(CSS)
div #header_mainmenu ul li{
width:100%;
display:inline;
text-align:left;
text-decoration:none;
}
*****************
なんと、これだけです。
メニューとしてはこれだけで十分ですね。
以上、本日のテクニックでした^^