Membuat Tab Menu View

 Untuk membuat tab menu seperti diatas gunakan kode seperti berikut ini :
 

<style type="text/css">/*menu Tab Views*/ div.TabView div.Tabs{width:auto;text-align:center; }
div.TabView div.Tabs a {background:#000;padding:4px;border-radius:10px 10px 0 0;border:4px double #ddd;text-decoration: none; font:bold 15px Arial;color:#fff; }
div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active {background-color: #f00;font-style:italic; }
.Pages {width:auto;height:320px;border:4px double #ddd;background:#f00;overflow:hidden;margin-top:6px;color:#000; }
.Page {width:auto;height:300px;overflow:auto; } .Page a{color:#fff; } /*NEW POST*/
#rp_plus_img{width:auto;height:300px;overflow:hidden;font-size:16px;color:#fff;padding:5px; }
#rp_plus_img ul{list-style-type:none;margin:0;padding:0; } #rp_plus_img li{border:1px; margin:0; padding:0; list-style:none; }
#rp_plus_img li{height:48px;padding:5px;list-style:none;border-radius:10px;border:1px solid #fff;-moz-box-shadow:inset 0 0 30px #000;-webkit-box-shadow:inset 0 0 30px #000;box-shadow:inset 0 0 30px #000; }
#rp_plus_img .news-title{display:block;font-size:14px;font-weight:bold;text-align:center;text-transform:uppercase; }
#rp_plus_img .news-text{display:block;font-size:12px;font-weight:normal;color:#000;text-align:left;text-transform:capitalize; }
#rp_plus_img img{float:left;margin-right:14px;padding:2px;width:40px;height:35px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;border:4px double #fff; } /*Archive*/
.judul-label{background-color:#424242;text-align: center;padding:5px;font:bold 16px Baumans;text-transform:uppercase;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;-webkit-box-shadow:0 1px 10px #fff;-moz-box-shadow:1px 1px 10px #fff;box-shadow:0 1px 10px #fff;color:#ddd;border:2px solid #fff; }
.data-list a{font-size:14px; } /*Koment*/     ul.w2b_recent_comments {     list-style: none;padding:5px;     }   
.w2b_recent_comments li {     background:#ddd;     margin:6px !important;     padding:6px !important;     display: block;     clear: both;     overflow: hidden;     list-style: none;     border-radius: 10px;     border:1px solid #000;     }   
.w2b_recent_comments li .avatarImage {     padding: 3px;     float: left;     margin: 0 6px 0 0;     position: relative;     overflow: hidden;     }   
.avatarRound {     -webkit-border-radius: 100px;     -moz-border-radius: 100px;     border-radius: 100px;     border:2px solid #000;     box-shadow:inset 0 0 10px #000,0 0 10px #000;     }   
.w2b_recent_comments li img {     padding: 0px;     position: relative;     overflow: hidden;     display: block;     }   
.w2b_recent_comments li span {     margin-top: 4px;     color: #000;     display: block;     font-size: 12px;     font-style: italic;     line-height: 1.4;     } </style>
<script src="https://overlay-basic.googlecode.com/svn/branches/tapmenuview-amarajen.js" type="text/javascript"></script>
<br />
<form action="tabview.html" method="get">
<div class="TabView" id="TabView">
<div class="Tabs">
<a href="https://www.blogger.com/null">NEW POST</a><a href="https://www.blogger.com/null">BLOG ARSIP</a><a href="https://www.blogger.com/null">NEW COMMENT</a></div>
<div class="Pages">
<div class="Page">
<script src="https://wedansong.googlecode.com/svn/branches/animasi-win8-6.js" type="text/javascript"></script>

<br />
<ul id="rp_plus_img"><script>var numposts = 6; var numchars = 70; </script>
<script src="/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rpthumbnt"></script></ul>
</div>
<div class="Page">
<script src="https://overlay-basic.googlecode.com/svn/branches/site-map(2)-amarajen.js"></script><script src="http://andrianawildan.blogspot.com/feeds/posts/summary?max-results=1000&amp;alt=json-in-script&amp;callback=loadtoc"></script>
<script type="text/javascript">var accToc=true;</script></div>
<div class="Page">
<script src="https://sites.google.com/site/kontols33/recent-comment.js" type="text/javascript"></script>
<script src="http://andrianawildan.blogspot.com/feeds/comments/default?alt=json&amp;callback=w2b_recent_comments&amp;max-results=5" type="text/javascript"></script>
</div>
</div>
<script type="text/javascript">tabview_initialize('TabView'); </script></div>
</form>