16 Style Vertical Menu For Blogger

Kode :

<style>#z33sPR ul { list-style: none; margin: 0; padding: 0; } #z33sPR img { border: none; } #z33sPR { width: 200px; border-style: solid solid none solid; border-color: #677D92; border-size: 1px; border-width: 1px; margin: 10px; } #z33sPR li a { height: 32px; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; font-size: 10pt; font-weight: bold; background: #FFF; height: 24px; text-decoration: none; } #z33sPR li a:link, #z33sPR li a:visited { color: #fff; display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdgYvqdTQZgEtpLGgQzTsHRHDUxWV-o5F6Zr0KWf4Xb_yp0LFMgQnWcBSQdR8K1ytNCl2nCaCSn2bwD2dLoyuHjG7vHgASvx2VfA9tNDTzvQIrwqSseE96HtdcbO7EW2bjqhUyoz4kAfs/s800/z33sPR.gif); padding: 8px 0 0 10px; } #z33sPR li a:hover, #z33sPR li #current { color: #283A50; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdgYvqdTQZgEtpLGgQzTsHRHDUxWV-o5F6Zr0KWf4Xb_yp0LFMgQnWcBSQdR8K1ytNCl2nCaCSn2bwD2dLoyuHjG7vHgASvx2VfA9tNDTzvQIrwqSseE96HtdcbO7EW2bjqhUyoz4kAfs/s800/z33sPR.gif) 0 -32px; padding: 8px 0 0 10px; } #z33sPR li a:active { color: #283A50; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdgYvqdTQZgEtpLGgQzTsHRHDUxWV-o5F6Zr0KWf4Xb_yp0LFMgQnWcBSQdR8K1ytNCl2nCaCSn2bwD2dLoyuHjG7vHgASvx2VfA9tNDTzvQIrwqSseE96HtdcbO7EW2bjqhUyoz4kAfs/s800/z33sPR.gif) 0 -64px; padding: 8px 0 0 10px; }</style><div id="z33sPR"> <ul> <li><a href="#1">Link 1</a></li> <li><a href="#2">Link 2</a></li> <li><a href="#3">Link 3</a></li> <li><a href="#4">Link 4</a></li> <li><a href="#5">Link5</a></li> </ul> </div>

Kode :

<style>#z33sG1 ul { list-style: none; margin: 0; padding: 0; } #z33sG1 img { border: none; } #z33sG1 { width: 200px; border-style: solid solid none solid; border-color: #94AA74; border-size: 1px; border-width: 1px; margin: 10px; } #z33sG1 li a { height: 32px; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; font-size: 10pt; font-weight: bold; background: #FFF; height: 24px; text-decoration: none; } #z33sG1 li a:link, #z33sG1 li a:visited { color: #5E7830; display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjewbLS4WW5SZBVM8k7PfxLuUkKO9WwArvdDJm-cWc2mFp-6BvseS3eKAuBNG4-4qxkMKUMaOZqweQdL8eK95bBbrbzaLTODotWUwlZ61JC3J2jiU3N7k0x30mttCU3pGbi9Zfdl8cJgdU/s800/z33sG11.gif); padding: 8px 0 0 10px; } #z33sG1 li a:hover, #z33sG1 li #current { color: #26370A; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjewbLS4WW5SZBVM8k7PfxLuUkKO9WwArvdDJm-cWc2mFp-6BvseS3eKAuBNG4-4qxkMKUMaOZqweQdL8eK95bBbrbzaLTODotWUwlZ61JC3J2jiU3N7k0x30mttCU3pGbi9Zfdl8cJgdU/s800/z33sG11.gif) 0 -32px; padding: 8px 0 0 10px; } #z33sG1 li a:active { color: #26370A; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjewbLS4WW5SZBVM8k7PfxLuUkKO9WwArvdDJm-cWc2mFp-6BvseS3eKAuBNG4-4qxkMKUMaOZqweQdL8eK95bBbrbzaLTODotWUwlZ61JC3J2jiU3N7k0x30mttCU3pGbi9Zfdl8cJgdU/s800/z33sG11.gif) 0 -64px; padding: 8px 0 0 10px; }</style><div id="z33sG1"> <ul> <li><a href="#1">Link 1</a></li> <li><a href="#2">Link 2</a></li> <li><a href="#3">Link 3</a></li> <li><a href="#4">Link 4</a></li><li><a href="#5">Link5</a></li></ul></div>

Kode :

<style>#z33s2 ul { list-style: none; margin: 0; padding: 0; } #z33s2 img { border: none; } #z33s2 { width: 200px; margin: 10px; border-style: solid solid none solid; border-color: #D8D5D1; border-size: 1px; border-width: 1px; } #z33s2 li a { height: 32px; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; font-size: 10pt; font-weight: bold; background: #FFF; height: 24px; text-decoration: none; } #z33s2 li a:link, #z33s2 li a:visited { color: #3688BA; display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJ7BTaVucsgQdy-zfMYi1U9C8jO41gY2vRKBrJSBzCb8J55p-dDA534wgzXiE1e-vdNAq2Uojk3UnJ1UW5qoyhW3W5gwIKJgqaIyweUBk5Zpd2GljMr9Ve2Ux2r-jGHXeZd-ixLuNxdX4/s800/z33s2.gif); padding: 8px 0 0 30px; } #z33s2 li a:hover { color: #3688BA; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJ7BTaVucsgQdy-zfMYi1U9C8jO41gY2vRKBrJSBzCb8J55p-dDA534wgzXiE1e-vdNAq2Uojk3UnJ1UW5qoyhW3W5gwIKJgqaIyweUBk5Zpd2GljMr9Ve2Ux2r-jGHXeZd-ixLuNxdX4/s800/z33s2.gif) 0 -32px; padding: 8px 0 0 32px; }</style><div id="z33s2"> <ul> <li><a href="#1">Link 1</a></li> <li><a href="#2">Link 2</a></li> <li><a href="#3">Link 3</a></li> <li><a href="#4">Link 4</a></li> <li><a href="#5">Link5</a></li> </ul> </div>

Kode :

<style>#z33sPink1 ul { list-style: none; margin: 0; padding: 0; } #z33sPink1 img { border: none; } #z33sPink1 { width: 200px; margin: 10px; } #z33sPink1 li a { height: 32px; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; font-size: 10pt; font-weight: bold; background: #FFF; height: 24px; text-decoration: none; } #z33sPink1 li a:link, #z33sPink1 li a:visited { color: #C7377D; display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiS1yKvSf_ryGMNN82aSYbnss6T0Xb8SShbk5ywKI4tKGkb-O5iTzh315m190v6W_flvz0QdeDZWXR8RTSFIoLFPnq3UYchsUqvN7d224KRJsImXdaFnOYX3-oSwCqrwsZr3muw_DhZGYg/s800/z33sPink1.gif); padding: 8px 0 0 10px; } #z33sPink1 li a:hover { color: #C7377D; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiS1yKvSf_ryGMNN82aSYbnss6T0Xb8SShbk5ywKI4tKGkb-O5iTzh315m190v6W_flvz0QdeDZWXR8RTSFIoLFPnq3UYchsUqvN7d224KRJsImXdaFnOYX3-oSwCqrwsZr3muw_DhZGYg/s800/z33sPink1.gif) 0 -32px; padding: 8px 0 0 10px; }</style><div id="z33sPink1"> <ul> <li><a href="#1">Link 1</a></li> <li><a href="#2">Link 2</a></li> <li><a href="#3">Link 3</a></li> <li><a href="#4">Link 4</a></li> <li><a href="#5">Link5</a></li> </ul> </div>

Kode :

<style>#z33sVr{border-bottom-width: 0;}#z33sVr ul{margin: 0;padding: 0;font: normal 90% 'Trebuchet MS', 'Lucida Grande', Arial, sans-serif;}#z33sVr a{display: block;padding: 3px 0;padding-left: 9px;width: 200px;text-decoration: none;color: #333222;border-right:1px solid #000000;background-color: #FBEC04;border-bottom: 1px solid #6A6731;border-left: 7px solid #918C3B;}#z33sVr a:hover {background-color: #FAF6B9;border-left: 12px solid #918C3B;width: 195px;}#z33sVr div.JudulNa{color: white;border-bottom: 1px solid #053E66;padding: 5px 3px 5px 13px;background-color: black;width: 201px;font: bold 90% 'Trebuchet MS', 'Lucida Grande', Arial, sans-serif;}</style><br /><div id="z33sVr"><div class="JudulNa">Contoh 1</div><ul><a href="#">Home</a><a href="#">Link 1</a><a href="#">Link 2</a></ul><div class="JudulNa">Contoh 2</div><ul><a href="#">Link 3</a><a href="#">Link 4</a><a href="#">Link 5</a><a href="#">Link 6</a></ul></div>

Kode :

<style>#z33sBL1 ul { list-style: none; margin: 0; padding: 0; } #z33sBL1 img { border: none; } #z33sBL1 { width: 200px; margin: 10px; } #z33sBL1 li a { height: 32px; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; font-size: 10pt; font-weight: bold; background: #FFF; height: 24px; text-decoration: none; } #z33sBL1 li a:link, #z33sBL1 li a:visited { color: #4D4D4D; display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixtq-GB-onoNzWrjPjeEw-8UcdmhgpEjObiSRT0pTlVCeYMTB6kksjbaR461sV4prQ6SK77ny_ja8I2WqwBmiX8EYSoDjWFfs7OVdZijBDB807pDEgCCy1T0cHJ77aDUFwW11UvrH036w/s800/z33sBL1.gif); padding: 8px 0 0 10px; } #z33sBL1 li a:hover { color: #FF9834; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixtq-GB-onoNzWrjPjeEw-8UcdmhgpEjObiSRT0pTlVCeYMTB6kksjbaR461sV4prQ6SK77ny_ja8I2WqwBmiX8EYSoDjWFfs7OVdZijBDB807pDEgCCy1T0cHJ77aDUFwW11UvrH036w/s800/z33sBL1.gif) 0 -32px; padding: 8px 0 0 10px; }</style><div id="z33sBL1"> <ul> <li><a href="#1">Link 1</a></li> <li><a href="#2">Link 2</a></li> <li><a href="#3">Link 3</a></li> <li><a href="#4">Link 4</a></li> <li><a href="#5">Link5</a></li> </ul> </div>

Kode :

<style>#z33sBL2 ul { list-style: none; margin: 0; padding: 0; } #z33sBL2 img { border: none; } #z33sBL2 { width: 200px; margin: 10px; } #z33sBL2 li a { height: 32px; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; font-size: 10pt; font-weight: bold; background: #FFF; height: 24px; text-decoration: none; } #z33sBL2 li a:link, #z33sBL2 li a:visited { color: #fff; display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmtlkGS5fpy3Y6sEZxU7yoQ6Q0sfug3WJt3Fpr9EaNY0lq7gy3c8dWVNJjaCa0OwWpLfCvUia4J30RoO12f0tcwYhuToyUiKQHr8T6iRAZJ2JydOHwECFmMMV0PA_2UGhV7GGzAPxzaNs/s800/z33sBL2.gif) 0 -32px; padding: 8px 0 0 10px; } #z33sBL2 li a:hover { color: #333; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmtlkGS5fpy3Y6sEZxU7yoQ6Q0sfug3WJt3Fpr9EaNY0lq7gy3c8dWVNJjaCa0OwWpLfCvUia4J30RoO12f0tcwYhuToyUiKQHr8T6iRAZJ2JydOHwECFmMMV0PA_2UGhV7GGzAPxzaNs/s800/z33sBL2.gif); padding: 8px 0 0 10px; }</style><div id="z33sBL2"><br /><ul><br /><li><a href="#1">Link 1</a></li><br /><li><a href="#2">Link 2</a></li><br /><li><a href="#3">Link 3</a></li><br /><li><a href="#4">Link 4</a></li><br /><li><a href="#5">Link5</a></li><br /></ul><br /></div><br />

Kode :

<style>#z33sBrown ul { list-style: none; margin: 0; padding: 0; } #z33sBrown img { border: none; } #z33sBrown { width: 200px; margin: 10px; border-style: solid solid none solid; border-color: #3D261D; border-size: 1px; border-width: 1px; } #z33sBrown li a { height: 32px; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; font-size: 10pt; font-weight: bold; background: #FFF; height: 24px; text-decoration: none; } #z33sBrown li a:link, #z33sBrown li a:visited { color: #E4D6CD; display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHBYVUTTbVFvCcjOzYXKW2XbMRiVu0mcx7K9OJ0sR0VkjsQ_Ky71n4_2bDdhMobL4Ap1J_fQgKlBB8bZmczPgGSdE6bjWP3KzHelvwccG8VmjxaLVvDsgNRO3JWVM5xc4fuzKrgFCqJF8/s800/z33sBrown.gif); padding: 8px 0 0 10px; } #z33sBrown li a:hover { color: #FFF; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHBYVUTTbVFvCcjOzYXKW2XbMRiVu0mcx7K9OJ0sR0VkjsQ_Ky71n4_2bDdhMobL4Ap1J_fQgKlBB8bZmczPgGSdE6bjWP3KzHelvwccG8VmjxaLVvDsgNRO3JWVM5xc4fuzKrgFCqJF8/s800/z33sBrown.gif) 0 -32px; padding: 8px 0 0 10px; }</style><div id="z33sBrown"><br /><ul><br /><li><a href="#1">Link 1</a></li><br /><li><a href="#2">Link 2</a></li><br /><li><a href="#3">Link 3</a></li><br /><li><a href="#4">Link 4</a></li><br /><li><a href="#5">Link5</a></li><br /></ul><br /></div><br />

Kode :

<style>#z33sS1 ul { list-style: none; margin: 0; padding: 0; } #z33sS1 img { border: none; } #z33sS1 { width: 200px; margin: 10px; } #z33sS1 li a { height: 32px; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; font-size: 10pt; font-weight: bold; background: #FFF; height: 24px; text-decoration: none; } #z33sS1 li a:link, #z33sS1 li a:visited { color: #FFF; display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5EybINrT_Y16mJZd4d7EwRQRSFYAGBjbc9itfGYWGukIyqbNayzIQZmNqLBvDnddpQmgqE0FAOSlUOma2o092rq44AeQKxla0JSl8QZgWL52dcO82HZNwodURbg2I8sIhyUIH7gSwqVQ/s800/z33sS1.gif); padding: 8px 0 0 30px; } #z33sS1 li a:hover { color: #FFF; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5EybINrT_Y16mJZd4d7EwRQRSFYAGBjbc9itfGYWGukIyqbNayzIQZmNqLBvDnddpQmgqE0FAOSlUOma2o092rq44AeQKxla0JSl8QZgWL52dcO82HZNwodURbg2I8sIhyUIH7gSwqVQ/s800/z33sS1.gif) 0 -32px; padding: 8px 0 0 30px; }</style><div id="z33sS1"> <ul> <li><a href="#1">Link 1</a></li> <li><a href="#2">Link 2</a></li> <li><a href="#3">Link 3</a></li> <li><a href="#4">Link 4</a></li> <li><a href="#5">Link5</a></li> </ul> </div>

Kode :

<style>#z33sY1 ul { list-style: none; margin: 0; padding: 0; } #z33sY1 img { border: none; } #z33sY1 { width: 200px; margin: 10px; border-style: solid solid none solid; border-color: #889944; border-size: 1px; border-width: 1px; } #z33sY1 li a { height: 32px; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; font-size: 10pt; font-weight: bold; background: #FFF; height: 24px; text-decoration: none; } #z33sY1 li a:link, #z33sY1 li a:visited { color: #889944; display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTDseIcbRiWjRGMQEBeascDL2dDlNDmAT3JaxvqlBovcrjXMYP3X4K9TMcoYs8tr3hr1_FNM3Ohyr1gLTh8_2kl0KO6XjGkJ7hn4bHIDl9KpMFcx2hgQKjjB_7xUWlvXnJptlenKZhUqo/s400/z33sY1.gif); padding: 8px 0 0 25px; } #z33sY1 li a:hover { color: #889944; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTDseIcbRiWjRGMQEBeascDL2dDlNDmAT3JaxvqlBovcrjXMYP3X4K9TMcoYs8tr3hr1_FNM3Ohyr1gLTh8_2kl0KO6XjGkJ7hn4bHIDl9KpMFcx2hgQKjjB_7xUWlvXnJptlenKZhUqo/s400/z33sY1.gif) 0 -32px; padding: 8px 0 0 27px; }</style><div id="z33sY1"> <ul> <li><a href="#1">Link 1</a></li> <li><a href="#2">Link 2</a></li> <li><a href="#3">Link 3</a></li> <li><a href="#4">Link 4</a></li> <li><a href="#5">Link5</a></li> </ul> </div>

Kode :

<style>#z33sB9 ul { list-style: none; margin: 0; padding: 0; } #z33sB9 img { border: none; } #z33sB9 { width: 200px; margin-top: 10px; } #z33sB9 li a { height: 32px; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; font-size: 10pt; font-weight: bold; background: #FFF; height: 24px; text-decoration: none; } #z33sB9 li a:link, #z33sB9 li a:visited { color: #E5E8D4; display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCW6PD96rhdxl8_aPHF13YBTpRz3Z5iY7bdT039aWiOedz-R0xT7MmVO4-RY3pnE4ZG2lblDuAMEr0HzAl7Y6uNlAjDR2R96dFfptZmNoeDJDTKPkX5am2d5r3IJVF6Byy8e0mPF8CBvI/s800/z33sB9.gif); padding: 8px 0 0 10px; } #z33sB9 li a:hover, #z33sB9 li #current { color: #725033; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCW6PD96rhdxl8_aPHF13YBTpRz3Z5iY7bdT039aWiOedz-R0xT7MmVO4-RY3pnE4ZG2lblDuAMEr0HzAl7Y6uNlAjDR2R96dFfptZmNoeDJDTKPkX5am2d5r3IJVF6Byy8e0mPF8CBvI/s800/z33sB9.gif) 0 -32px; padding: 8px 0 0 10px; } #z33sB9 li a:active { color: #fff; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCW6PD96rhdxl8_aPHF13YBTpRz3Z5iY7bdT039aWiOedz-R0xT7MmVO4-RY3pnE4ZG2lblDuAMEr0HzAl7Y6uNlAjDR2R96dFfptZmNoeDJDTKPkX5am2d5r3IJVF6Byy8e0mPF8CBvI/s800/z33sB9.gif) 0 -64px; padding: 8px 0 0 10px; }</style><div id="z33sB9"> <ul> <li><a href="#1">Link 1</a></li> <li><a href="#2">Link 2</a></li> <li><a href="#3">Link 3</a></li> <li><a href="#4">Link 4</a></li> <li><a href="#5">Link5</a></li> </ul> </div>

Kode :

<style>#z33sRBT ul { list-style: none; margin: 0; padding: 0; } #z33sRBT img { border: none; } #z33sRBT { width: 200px; margin: 10px; } #z33sRBT li a { height: 32px; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; font-size: 10pt; font-weight: bold; background: #FFF; height: 22px; text-decoration: none; } #z33sRBT li a:link, #z33sRBT li a:visited { color: #666; display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVufhUmndmMk-FwpWBWTKaV5B7Ok4wB3ylORCswemjti5Gy3sz6uRmitDG4OtyNWWPm0_Z5hsQvhCzl7l8Le6Ig8JIoLhjntL_vQcQT-03H787RcTEaLcsYx1-VR3JewisolyPfvFO7dM/s800/z33sRBT.gif); padding: 10px 0 0 35px; } #z33sRBT li a:hover { color: #000; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVufhUmndmMk-FwpWBWTKaV5B7Ok4wB3ylORCswemjti5Gy3sz6uRmitDG4OtyNWWPm0_Z5hsQvhCzl7l8Le6Ig8JIoLhjntL_vQcQT-03H787RcTEaLcsYx1-VR3JewisolyPfvFO7dM/s800/z33sRBT.gif) 0 -32px; padding: 10px 0 0 35px; }</style><div id="z33sRBT"> <ul> <li><a href="#1">Link 1</a></li> <li><a href="#2">Link 2</a></li> <li><a href="#3">Link 3</a></li> <li><a href="#4">Link 4</a></li> <li><a href="#5">Link5</a></li> </ul> </div>

Kode :

<style>#z33s5 ul { list-style: none; margin: 0; padding: 0; } #z33s5 img { border: none; } #z33s5 { width: 200px; border-style: none solid none solid; border-color: #D0D0D0; border-width: 1px; margin: 10px; } #z33s5 li a { height: 32px; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; font-size: 10pt; font-weight: bold; background: #FFF; height: 24px; text-decoration: none; } #z33s5 li a:link, #z33s5 li a:visited { color: #777; display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgn7crjCHEg_1QJg3ew6EzBrVENqO2ohGYWsIKCJcRlU9kNsIQ0Y2TdJlWsiJGFbL3OGws21zdj454oOl-Mz-483hZOQwrZ7isEoJ2FSz6y54gzJpbuDwyVzZ7bPqplsXPdAEGWlkqfjwk/s800/z33s5.gif); padding: 8px 25px 0 10px; text-align: right; } #z33s5 li a:hover, #z33s5 li #current { color: #fff; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgn7crjCHEg_1QJg3ew6EzBrVENqO2ohGYWsIKCJcRlU9kNsIQ0Y2TdJlWsiJGFbL3OGws21zdj454oOl-Mz-483hZOQwrZ7isEoJ2FSz6y54gzJpbuDwyVzZ7bPqplsXPdAEGWlkqfjwk/s800/z33s5.gif) 0 -32px; padding: 8px 25px 0 10px; text-align: right; } #z33s5 li a:active { color: #fff; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgn7crjCHEg_1QJg3ew6EzBrVENqO2ohGYWsIKCJcRlU9kNsIQ0Y2TdJlWsiJGFbL3OGws21zdj454oOl-Mz-483hZOQwrZ7isEoJ2FSz6y54gzJpbuDwyVzZ7bPqplsXPdAEGWlkqfjwk/s800/z33s5.gif) 0 -64px; padding: 8px 25px 0 10px; text-align: right; }</style><div id="z33s5"> <ul> <li><a href="#1">Link 1</a></li> <li><a href="#2">Link 2</a></li> <li><a href="#3">Link 3</a></li> <li><a href="#4">Link 4</a></li> <li><a href="#5">Link5</a></li> </ul> </div>

Kode :

<style>#z33sBRSide ul { list-style: none; margin: 0; padding: 0; } #z33sBRSide img { border: none; } #z33sBRSide { width: 200px; margin: 10px; } #z33sBRSide li a { height: 32px; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; font-size: 10pt; font-weight: bold; background: #FFF; height: 24px; text-decoration: none; } #z33sBRSide li a:link, #z33sBRSide li a:visited { color: #8D9179; display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVLQBFK_G-xmGQ_M5G8r4MvTB6Qyn2aBIxg81BtHIhnU36xT1C8u7s4RgkdYzFHVHiS9uIQp4tJokIDCx6t06YfeTObvG35MWtvE2wsFpUMhEZz5oonHBBf5RuaSaaeAH72OaB-QhKV9I/s800/z33sBRSide.gif); padding: 8px 0 0 10px; } #z33sBRSide li a:hover, #z33sBRSide li #current, #z33sBRSide li a:active { color: #6C7250; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVLQBFK_G-xmGQ_M5G8r4MvTB6Qyn2aBIxg81BtHIhnU36xT1C8u7s4RgkdYzFHVHiS9uIQp4tJokIDCx6t06YfeTObvG35MWtvE2wsFpUMhEZz5oonHBBf5RuaSaaeAH72OaB-QhKV9I/s800/z33sBRSide.gif) 0 -32px; padding: 8px 0 0 10px; }</style><div id="z33sBRSide"> <ul> <li><a href="#1">Link 1</a></li> <li><a href="#2">Link 2</a></li> <li><a href="#3">Link 3</a></li> <li><a href="#4">Link 4</a></li> <li><a href="#5">Link5</a></li> </ul> </div>

Kode :

<style>#z33sOR ul { list-style: none; margin: 0; padding: 0; } #z33sOR img { border: none; } #z33sOR { width: 200px; margin: 10px; border-style: solid solid none solid; border-color: #000; border-size: 1px; border-width: 1px; } #z33sOR li a { height: 32px; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; font-size: 10pt; font-weight: bold; background: #FFF; height: 24px; text-decoration: none; } #z33sOR li a:link, #z33sOR li a:visited { color: #CCC; display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqgrbg0p1FxyuKCLoa5znryjK0-jUImcMrggXQxAYqwpOcs2BfmgDn6YoTOWkIC74RLvZ9LNJSltTff9FTUnwpI5qgUkfwF0Nm-oUyynewTkFu6n4DWL-LWLpEbaFDxgdMC67nMBH0Obw/s800/z33sOR.gif); padding: 8px 0 0 10px; } #z33sOR li a:hover { color: #FFF; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqgrbg0p1FxyuKCLoa5znryjK0-jUImcMrggXQxAYqwpOcs2BfmgDn6YoTOWkIC74RLvZ9LNJSltTff9FTUnwpI5qgUkfwF0Nm-oUyynewTkFu6n4DWL-LWLpEbaFDxgdMC67nMBH0Obw/s800/z33sOR.gif) 0 -32px; padding: 8px 0 0 10px; }</style><div id="z33sOR"> <ul> <li><a href="#1">Link 1</a></li> <li><a href="#2">Link 2</a></li> <li><a href="#3">Link 3</a></li> <li><a href="#4">Link 4</a></li> <li><a href="#5">Link5</a></li> </ul> </div>

Kode :

Silahkan KLIK DISINI

Silahkan kirimkan Donasi anda seikhlasnya berupa uang/pulsa (Klik Gambar kado disamping) untuk perkembangan blog ini dan Proses pembelajaran untuk sahabat.

Penulis :  Azis Lamayuda | BLOG : Do The Best To Get The Best
Saya hanyalah seorang yang sedang belajar dan berbagi pelajaran dengan siapapun. Blog ini dibuat untuk memudahkan kalian yang sedang belajar sama seperti saya.