Cara Membuat Menu Menyusun

Silahkan gantikan link sesuai dengan anda punya:

JUDUL SPOILER

<div style="text-align: left;">
<style>
#css3pic{background: rgb(176,174,38); /* Fallback Background color */
background: url(images/pattern.png), -moz-linear-gradient(top, rgba(176,174,38,1) 0%, #6e6c00 100%);
background:url(images/pattern.png), -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(176,174,38,1)), color-stop(100%,rgba(110,108,0,1)));width:960px;border-top:1px solid #ccc;margin:0 auto;padding:0 auto;border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border: solid 1px #251400;}
#css3wrapper{width:960px;height:27px;margin:0 auto}
.clearit{clear:both;height:0;line-height:0.0;font-size:0}
#css3bar{width:100%}
#css3bar,#css3bar ul{list-style:none;font-family:Arial, serif;margin:0;padding:0}
#css3bar a{display:block;text-decoration:none;font-size:12px;font-weight:bold;text-transform:uppercase;color:#333;padding:8px 8px 8px}
#css3bar a.trigger{padding:8px 13px 8px 9px}
#css3bar li{float:left;position:static;width:auto}
#css3bar li ul,#css3bar ul li{width:140px}
#css3bar ul li a{text-align:left;color:#fff;font-size:11px;font-weight:400;text-transform:none;font-family:Arial;border:none;padding:5px 10px;}
#css3bar li ul{z-index:100;position:absolute;display:none;background:#333;padding-bottom:5px;border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border: solid 1px #251400;}
#css3bar li:hover a,#css3bar a:active,#css3bar a:focus,#css3bar li.hvr a{;color:#fff;-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out; }
#css3bar li:hover ul,#css3bar li.hvr ul{background: rgb(176,174,38); /* Fallback Background color */
background: url(images/pattern.png), -moz-linear-gradient(top, rgba(176,174,38,1) 0%, #6e6c00 100%);
background:url(images/pattern.png), -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(176,174,38,1)), color-stop(100%,rgba(110,108,0,1)));display:block}
#css3bar li:hover ul a,#css3bar li.hvr ul a{color:#fff;background-color:transparent;text-decoration:none}
#css3bar li ul li.hr{border-top:1px solid #444;display:block;font-size:1px;height:0;line-height:0;margin:2px 0}
#css3bar ul a:hover{background-image: -webkit-linear-gradient(top, #990066, #cc0099, #990066);
background-image: -moz-linear-gradient(top, #990066, #cc0099, #990066);
background-image: -ms-linear-gradient(top, #990066, #cc0099, #990066);
background-image: -o-linear-gradient(top, #990066, #cc0099, #990066);!important;color:#fff!important;text-decoration:none}

</style></div>
<div id="css3pic" style="text-align: left;">
<div id="css3wrapper">
<ul id="css3bar">
<li><a href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#" target="_blank">Home</a></li>
<li><a class="trigger" href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#" target="_blank">Blogger</a>
<ul>
<li><a href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#" target="_blank">Tutorial Blogger</a></li>
<li><a href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">Tips Blogger</a></li>
<li><a href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">Widget</a></li>
<li><a href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">CSS</a></li>
<li><a href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">jQuery</a></li>
</ul>
</li>
<li><a class="trigger" href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">Lifestyle</a>
<ul>
<li><a href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">Health</a></li>
<li><a href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">Travel</a></li>
<li><a href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">Food</a></li>
</ul>
</li>
<li><a class="trigger" href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">Design</a>
<ul>
<li><a href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">Art</a></li>
<li><a href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">Web</a></li>
<li><a href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">Blog</a></li>
</ul>
</li>
<li><a class="trigger" href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">Technology</a>
<ul>
<li><a href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">Handphone</a></li>
<li><a href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">Gadget</a></li>
<li><a href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">Computer</a></li>
</ul>
</li>
<li><a class="trigger" href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">Sports</a>
<ul>
<li><a href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">Tennis</a></li>
<li><a href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">Moto GP</a></li>
<li><a href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">Bulu Tangkis</a></li>
</ul>
</li>
<li><div id="coom">
<a class="trigger" href="http://www.blogger.com/post-create.g?blogID=4624773008056743393#">Community</a> </div>
</li>
</ul>
</div>
<div style="clear: both;">
</div>
</div>

Contoh Seperti dibawah ini:

• Home
• Blogger
  
  • Tutorial Blogger
  • Tips Blogger
  • Widget
  • CSS
  • jQuery
• Lifestyle
  
  • Health
  • Travel
  • Food
• Design
  
  • Art
  • Web
  • Blog
• Technology
  
  • Handphone
  • Gadget
  • Computer
• Sports
  
  • Tennis
  • Moto GP
  • Bulu Tangkis
• Community