Renkli Link Butonlar

Renkli Link Butonlar webmaster arakdaşların işine çok yarayacak paylaşımlar sunuyoruz.

---

CSS Kodu:
<style>.button.small{font-size:10px} .button.medium{font-size:12px; padding:10px 12px 11px} .button.large{font-size:14px; padding:12px 14px 13px} .button.huge{font-size:18px; padding:14px 16px 15px} .button.red{background:#C60108} .button.orange{background:#E97F02} .button.yellow{background:#ECBA09} .button.green{background:#8FBE00} .button.blue{background:#00A8C6} .button.purple{background:#490A3D} .button.purple:hover, .button.blue:hover, .button.green:hover, .button.yellow:hover, .button.orange:hover, .button.red:hover{background:#222} input#s{padding:10px; border-style:solid; border-width:1px; font-size:10px; width:90%; max-width:300px; margin:0} input[type=text], textarea{margin:0 0 20px 0; border-style:solid; border-width:1px; font-size:12px; width:90%; padding:10px} .button, a.button, a.more-link{background-color:#222; color:#FFF; cursor:pointer; display:inline-block; font-style:normal; font-weight:bold; letter-spacing:normal; line-height:1; padding:8px 10px 9px; position:relative; text-decoration:none; font-size:10px; -moz-transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s; -o-transition:all 0.3s ease 0s; transition:all 0.3s ease 0s; -moz-transition:all 0.3s ease 0s; border:none} .button:hover, a.button:hover, a.more-link:hover{color:#fff} .button.custom:hover, a.button.custom:hover{background:#222 !important} a.more-link, a.button, .button{margin-top:10px} </style>

Küçük Boyutta Buton Kaynak HTML:
<a class="button custom orange small" href="#" >Yunti Facebook</a><a class="button custom green small" href="#" >Twitter Yunti</a><a class="button custom red small" href="#" >Blogger Yunti</a><a class="button custom blue small" href="#" >Google + Yunti</a>

Orta Boyutta Buton Kaynak HTML:
<a class="button custom orange medium" href="#" >Yunti Facebook</a><a class="button custom green medium" href="#" >Twitter Yunti</a><a class="button custom red medium" href="#" >Blogger Yunti</a><a class="button custom blue medium" href="#" >Google + Yunti</a>

Büyük Boyutta Buton Kaynak HTML:
<a class="button custom orange large" href="#" >Yunti Facebook</a><a class="button custom green large" href="#" >Twitter Yunti</a><a class="button custom red large" href="#" >Blogger Yunti</a><a class="button custom blue large" href="#" >Google + Yunti</a>

By: Unknown On 7/28/2013

See More