横浜、東京に拠点を置き、検証システム/金融・証券のシステム等の構築、開発を行い、
ホームページの作成ツール支援と多岐にわたるソリューションを提供します。
マウスオーバーでデザインを変更する
cssの書き方 |
/*-------------------------------------------------- 03-11 テキストの量で変わるボタン --------------------------------------------------- */ .ebox_441{ float: left; margin: 0 0 10px 10px; border: 1px solid #2B2B35; width: 160px; padding: 4px; height: 300px; color: #FFFFFF; /* 白色 */ background-color: #010014; /* 黒色 */ } .ebox_441 a:link { color:#010014; } .ebox_441 a:visited { color:#010014; } .ebox_441 a:hover { color:#FFFFFF; } .ebox_441 a:active { color:#FFFFFF; } .ebox_441 ul{ text-align:left; } .ebox_441 dl{ position: relative; width: 160px; } .ebox_441 dt{ margin: 0 0 15px 0; font-size: small; line-height: 1.0; } .ebox_441 dt img{ margin: 0 0 7px 0; } .ebox_441 dd{ margin: 0; } .ebox_441 dl dd ul{ } .ebox_441 dl dd ul li{ list-style-type: none; } |
---|---|
HTMLの使用例 |
<div class="ebox_441"> <ul> <li class="date">Jul.30 18:00〜20:00</li> <li class="explain">星空を眺めながらバーべキュー。小雨決行。</li> <li class="entry"><a href="#"><span>バーベキュー申込 </span></a></li> <li class="condition"> <img src="../images/fes_event_iconFew.png" alt="締切間近" width="40" height="40" /></li> </ul> </div> |