Blogger Çoklu Demo ve Download Buton Kodları

   Blog sitenizde yayınlayacak olduğunuz yazılarında birden fazla download veya demo seçeneği kullanmak isterseniz aradığınız bu olabilir.

<style>
@font-face {font-family:'Oswald';font-style:normal;font-weight:300;
src:local('Oswald Light'), local('Oswald-Light'), url(http://themes.googleusercontent.com/static/fonts/oswald/v8/HqHm7BVC_nzzTui2lzQTDT8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}
/* Codex-KOM CSS Slide demom and doownload Button */
.doownload {font-family:'Oswald';font-weight:400;position:relative;overflow:hidden;text-align:center;margin:1em auto;
width:auto;height:50px;line-height:50px;border-radius:3px;}
.doownload h1 {font-family:'Oswald';font-weight:400;position:absolute;color:#fff;text-shadow:2px 2px 0 rgba(0,0,0,0.1);font-size:30px;line-height:50px;margin:0;padding:0;width:100%;background-color:#20a3cb;transition: margin-left 0.6s cubic-bezier(0.1,0.5,0.2,1);border-radius:3px;}
.doownload:hover h1{margin-left:100%;opacity:0.7;}
.doownload ul {display:inline-block;margin:0;padding:0;}
.doownload ul li {position:static;display:inline-block;padding:0 .1em;}
.doownload ul li::before {display:none;}
.doownload ul li a {color:#fff;font-size:20px;margin:0;padding:.2em .4em;background:none;transition:all 0.5s ease;}
.doownload ul li a:hover {background:#20a3cb;color:#fff;border-radius:2px;}
.doownload-infom{background:#1c94b9;box-shadow:0 0 3px rgba(0,0,0,0.3);}
.doownload-infom h1{background-color:#20a3cb;}
.demom {font-family:'Oswald';font-weight:400;position:relative;overflow:hidden;text-align:center;margin:1em auto;width:auto;height:50px;line-height:50px;border-radius:3px;}
.demom h1 {font-family:'Oswald';font-weight:400;position:absolute;color:#fff;text-shadow:2px 2px 0 rgba(0,0,0,0.1);font-size:30px;line-height:50px;margin:0;
padding:0;width:100%;background-color:#a3acb2;transition: margin-left 0.6s cubic-bezier(0.1,0.5,0.2,1);border-radius:3px;}
.demom:hover h1{margin-left:100%;opacity:0.7;}
.demom ul {display:inline-block;margin:0;padding:0;}
.demom ul li {position:static;display:inline-block;padding:0 .1em;}
.demom ul li::before {display:none;}
.demom ul li a {color:#fff;font-size:20px;margin:0;padding:.2em .4em;
background:none;transition:all 0.5s ease;}
.demom ul li a:hover {background:#a3acb2;color:#fff;border-radius:2px;}
.demom-infom{background:#8f979c;box-shadow:0 0 3px rgba(0,0,0,0.3);}
.demom-infom h1{background-color:#a3acb2;}
</style>
<div class="doownload doownload-infom">
<h1> doownload </h1>
<ul>
<li><a href="#" target="_blank"> doownload 1</a></li>
<li><a href="#" target="_blank"> doownload 2</a></li>
<li><a href="#" target="_blank"> doownload 3</a></li>
<li><a href="#" target="_blank"> doownload 4</a></li>
</ul>
</div>
<div class="demom demom-infom">
<h1> demom </h1>
<ul>
<li><a href="#" target="_blank"> demom 1 </a></li>
<li><a href="#" target="_blank"> demom 2 </a></li>
<li><a href="#" target="_blank"> demom 3 </a></li>
<li><a href="#" target="_blank"> demom 4 </a></li>
</ul>
</div>

Blogumuza Abone Olun
Yeni Yazılar E-posta Adresinize Gelsin

Not: Gelen Maili Aktif Etmeyi Unutmayınız!