ニュース

@wikiのwikiモードでは
#news(興味のある単語)
と入力することで、あるキーワードに関連するニュース一覧を表示することができます
詳しくはこちらをご覧ください。
=>http://atwiki.jp/guide/17_174_ja.html

<div id="menu">
<ul>
<li><a href="#">menu1</a>
<ul>
<li><a href="#">submenu1</a></li>
<li><a href="#">submenu2</a></li>
<li><a href="#">submenu3</a>
<ul>
<li><a href="#">submenu3-1</a></li>
<li><a href="#">submenu3-2</a></li>
<li><a href="#">submenu3-3</a>
<ul>
<li><a href="#">submenu3-3-1</a></li>
<li><a href="#">submenu3-3-2</a></li>
<li><a href="#">submenu3-3-3</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li><a href="#">menu2</a>
<ul>
<li><a href="#">submenu4</a></li>
<li><a href="#">submenu5</a></li>
</ul>
</li>
<li><a href="#">menu3</a>
<ul>
<li><a href="#">submenu6</a></li>
<li><a href="#">submenu7</a></li>
<li><a href="#">submenu8</a></li>
<li><a href="#">submenu9</a></li>
</ul>
</li>
</ul>
</div>

/* メインメニュー */
#menu
ul {
  display:block;
  list-style-type: none;
  margin:0;
  padding:0;
}

/* サブメニュー1段目 */
#menu
ul ul{
  display:none;
  position:absolute;
  top:100%;
  left:0;
}

/* サブメニュー2段目以降 */
#menu
ul ul ul {
  top:0;
  left:100%;
}

/* リスト */
#menu
li {
  float:left;
}

#menu
li li {
  clear:both;
}

#menu
li:hover {
  position:relative;
}

#menu
li:hover > ul {
  display: block

/* デザイン */
#menu
li {
  line-height:1.6em;
  text-align: center;
  background:#ddd;
}

#menu
li li {
  text-align: left;
}

#menu
li a{
  display: block;
  width:100px;
  text-decoration:none;
  color:#333;
  padding:0 10px;
}

#menu
li:hover {
  background:#7BBA10;
  color:#333;
}

#menu
.column1, #menu .column2, #menu .column3 {
  color:#333;
  background:#7BBA10;



たとえば、#news(wiki)と入力すると以下のように表示されます。



最終更新:2012年04月15日 23:51