Youtube Temalı Buton Kodu Ekle!

youtube butonlarına benzetilmiş bu hoş buton koduna bayılacaksınız! Üstelik ne kadar buton eklerseniz ekleyin, stil kodunu tek bir kez sitenize eklemeniz yeterli! Ardından kısa bir buton kodunu, butonların görünmesini istediğiniz yerlere, istediğiniz sayıda ekleyebilirsiniz!


İlk olarak bu stil kodunu sitenize bir kere ekleyin:

Kod:

<!--Kod Dostu Youtube Temalı Buton Kodu START-->
<!--Bu çalışma Creative Commons Attribution 3.0 Unported Lisansı ile lisanslanmıştır.-->
<!--Telif Sahibi: www.koddostu.com-->
<style>
/*koddostu.com tarafından kodlanmıştır*/
.koddostu-tube{background-color:#ccc;display:inline-block;height:30px;padding-left:8px;padding-right:8px;line-height:30px;font-family:Arial, sans-serif;font-size:11px;color:#555;font-weight:bold;text-decoration:none;-webkit-border-radius: 3px;border-radius: 3px;text-shadow:#FFFFFF 0px 1px 1px ;border:1px solid #ccc;background-image: linear-gradient(bottom, #DCDCDC 0%, #FAFAFA 100%);background-image: -o-linear-gradient(bottom, #DCDCDC 0%, #FAFAFA 100%);background-image: -moz-linear-gradient(bottom, #DCDCDC 0%, #FAFAFA 100%);background-image: -webkit-linear-gradient(bottom, #DCDCDC 0%, #FAFAFA 100%);background-image: -ms-linear-gradient(bottom, #DCDCDC 0%, #FAFAFA 100%);background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #DCDCDC),color-stop(1, #FAFAFA));}
/*koddostu.com tarafından kodlanmıştır*/
.koddostu-tube:focus{outline:0px;}
/*koddostu.com tarafından kodlanmıştır*/
.koddostu-tube:hover{border:1px solid #aaa;background-image: linear-gradient(bottom, #F0F0F0 0%, #E6E6E6 100%);background-image: -o-linear-gradient(bottom, #F0F0F0 0%, #E6E6E6 100%);background-image: -moz-linear-gradient(bottom, #F0F0F0 0%, #E6E6E6 100%);background-image: -webkit-linear-gradient(bottom, #F0F0F0 0%, #E6E6E6 100%);background-image: -ms-linear-gradient(bottom, #F0F0F0 0%, #E6E6E6 100%);background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #F0F0F0),color-stop(1, #E6E6E6));-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.25);-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.25);box-shadow: 0 1px 2px rgba(0,0,0,0.25);}
/*koddostu.com tarafından kodlanmıştır*/
.koddostu-tube:active{border:1px solid #aaa;border-bottom:1px solid #ccc;border-top:1px solid #888;background-image: linear-gradient(bottom, #E6E6E6 0%, #B8B8B8 100%);background-image: -o-linear-gradient(bottom, #E6E6E6 0%, #B8B8B8 100%);background-image: -moz-linear-gradient(bottom, #E6E6E6 0%, #B8B8B8 100%);background-image: -webkit-linear-gradient(bottom, #E6E6E6 0%, #B8B8B8 100%);background-image: -ms-linear-gradient(bottom, #E6E6E6 0%, #B8B8B8 100%);background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #E6E6E6),color-stop(1, #B8B8B8));-moz-box-shadow:none;-webkit-box-shadow:none;box-shadow:none;}
/*koddostu.com tarafından kodlanmıştır*/
</style>
<!--Bu çalışma Creative Commons Attribution 3.0 Unported Lisansı ile lisanslanmıştır.-->
<!--Telif Sahibi: www.koddostu.com-->
<!--Kod Dostu Youtube Temalı Buton Kodu STOP-->

Ardından, buton görünmesini istediğiniz her yere, bu koddan ekleyebilirsiniz:

Kod:

<koddostu>
<a href="http://koddostu.com" target="_blank" class="koddostu-tube">
Örnek Düğme
</a>
</koddostu>