DAFTAR MENU CANTIK

Dekati garis warna dengan mouse sudara

Belajar Blog Belajar FB Dwonlods Matematika Belajar MS

Pingin punya MENU WARNA WARNI seperti diatas pilih HTML/Javascript Copy Code Dibawah ini mudah bukan

<div id="colormenu"> <span class="blue"><a href="#">internet</a></span> <span class="red"><a href="#">learn how to</a></span> <span class="green"><a href="#">newspaper</a></span> <span class="yellow"><a href="#">twitter</a></span> <span class="green2"><a href="#">rss feeds</a></span> </div> <style type="text/css"> #colormenu { margin: 5px; padding: 5px } #colormenu a { font-family: Arial, Helvetica, sans-serif; padding: 6px 20px 9px 20px; font-size: 15px; color: #000; text-decoration: none; font-weight: bold; text-transform: uppercase } #colormenu .blue a, #colormenu .red a, #colormenu .green a, #colormenu .yellow a, #colormenu .green2 a { -webkit-transition: all 500ms ease-in-out; -moz-transition: all 500ms ease-in-out; -o-transition: all 500ms ease-in-out; transition: all 500ms ease-in-out } #colormenu .blue a { border-top: 6px solid #326abd } #colormenu .red a { border-top: 6px solid #b8462c } #colormenu .green a { border-top: 6px solid #a5cc3b } #colormenu .yellow a { border-top: 6px solid #e6ab07 } #colormenu .green2 a { border-top: 6px solid #2b9435 } #colormenu .blue a:hover { color: #FFF; background-color: #326abd; -webkit-border-bottom-left-radius: 9px; -moz-border-radius-bottomleft: 9px; border-bottom-left-radius: 9px; -webkit-border-bottom-right-radius: 9px; -moz-border-radius-bottomright: 9px; border-bottom-right-radius: 9px; -moz-border-radius-bottomleft: 9px; -moz-border-radius-bottomright: 9px } #colormenu .red a:hover { color: #FFF; background-color: #b8462c; -webkit-border-bottom-left-radius: 9px; -moz-border-radius-bottomleft: 9px; border-bottom-left-radius: 9px; -webkit-border-bottom-right-radius: 9px; -moz-border-radius-bottomright: 9px; border-bottom-right-radius: 9px; -moz-border-radius-bottomleft: 9px; -moz-border-radius-bottomright: 9px } #colormenu .green a:hover { color: #FFF; background-color: #a5cc3b; -webkit-border-bottom-left-radius: 9px; -moz-border-radius-bottomleft: 9px; border-bottom-left-radius: 9px; -webkit-border-bottom-right-radius: 9px; -moz-border-radius-bottomright: 9px; border-bottom-right-radius: 9px; -moz-border-radius-bottomleft: 9px; -moz-border-radius-bottomright: 9px } #colormenu .yellow a:hover { color: #FFF; background-color: #e6ab07; -webkit-border-bottom-left-radius: 9px; -moz-border-radius-bottomleft: 9px; border-bottom-left-radius: 9px; -webkit-border-bottom-right-radius: 9px; -moz-border-radius-bottomright: 9px; border-bottom-right-radius: 9px; -moz-border-radius-bottomleft: 9px; -moz-border-radius-bottomright: 9px } #colormenu .green2 a:hover { color: #FFF; background-color: #2b9435; -webkit-border-bottom-left-radius: 9px; -moz-border-radius-bottomleft: 9px; border-bottom-left-radius: 9px; -webkit-border-bottom-right-radius: 9px; -moz-border-radius-bottomright: 9px; border-bottom-right-radius: 9px; -moz-border-radius-bottomleft: 9px; -moz-border-radius-bottomright: 9px } </style>


http://sin1aja.blogspot.com/search?updated-max=2012-04-04T03:43:00%2B07:00&max-results=14&start=56&by-date=false