人気ブログランキング | 話題のタグを見る
<< 付箋の改良版 コメント欄の色の指定方法 >>
 

私が利用しているリンクメニューの設置方法



私が利用しているリンクメニューですが、以前説明した小窓の応用です。

この小窓は他のメニューに影響しないため、設置が簡単で初心者に向いています。
よろしかったらご利用下さい。スクロールバーの色も各小窓にあわせて設定が可能です。

※左右どちらでも設置が可能で、他のメニューに影響しません。




設置方法 HTML編集


<div CLASS="winodw" style="scrollbar-face-color:#C6D3FF;
">
Link<BR>
│ <BR>
├HTML&CSS関連<BR>
│├<a href="URL">サイト名</a><BR>
│├<a href="URL">サイト名</a><BR>
│├<a href="URL">サイト名</a><BR>
│└<a href="URL">サイト名</a><BR>
└<a href="URL">サイト名</a><BR>
</div>




設置方法 CSS編集


/*小窓*/
.windows{
overflow:scroll;
height:20em;
width:150px;
text-overflow:ellipsis;
word-break:keep-all;
white-space:nowrap;
background-color:#FFFFFF;
border:1px solid #CCC;
text-align:left;
scrollbar-face-color:#FFE8F7;
line-height:93%
}


ポイント
  • スクロールバーの色を変えるには、scrollbar-face-colorで指定します。デフォルトで色を指定して有りますが、各小窓ごとに色を変えるには、style="scrollbar-face-color:#C6D3FF;"を追加することにより可能です。
  • height:20em;で、行数を指定しています。20行以上で小窓が出現しますので、内容が少ない場合は、数字を小さくしてくださいね。2004.8.14追記


追記
私はの設置場所は、<$menuleft$>の前に設置しています。


ぽっと

CopyRight(C) 2004 All rights reserved by potto37




2004年9月18日
soliloquyさんのところで、メモ欄増設について の記事を紹介されています、よろしかったらご覧下さい。
記事の下の方に広告が表示される場合があります。この広告はエキサイトの広告枠です。
by potto37 | 2004-07-24 10:45 | │├メニュー
<< 付箋の改良版 コメント欄の色の指定方法 >>
掲載の記事や画像などすべての複写・転載・公衆送信等はご遠慮ください。