Création des Logiciels de gestion d'Entreprise, Création et référencement des sites web, Réseaux et Maintenance, Conception
Création des Logiciels de gestion d'Entreprise, Création et référencement des sites web, Réseaux et Maintenance, Conception
<ul class="social">
<li><a href="#"><span class="facebook icon"></span>Join Us on Facebook</a>
</li>
<li><a href="#"><span class="twitter icon"></span>Follow Us on Twitter</a>
</li>
<li><a href="#"><span class="pinterest icon"></span>Join Us on Pinterest</a>
</li>
<li><a href="#"><span class="email icon"></span>Send Us Email</a>
</li>
<li><a href="#"><span class="rss icon"></span>Subscrible RSS Feed</a>
</li>
</ul>
.social{
max-width:300px;
}
.social li{
min-height:40px;
clear:both;
float:none;
margin-bottom:10px;
}
.social a{
color:#232323;
position:relative;
display:block;
line-height:40px;
padding-left:55px;
}
.social span{
display:block;
width:40px;
height:40px;
background:url(http://www.matrixar.com/-ng7-UhdRPSA/UHf6kUbvs6I/AAAAAAAABoA/0Aw1xGCRstc/s1600/social.png) no-repeat;
position:Absolute;
left:0;
border-radius:32px;
box-shadow:0 2px 4px rgba(0,0,0,0.2);
}
.social .facebook{
background-color:#2d309a;
}
.social .twitter{
background-color:#00FFFF;
background-position:0 -40px;
}
.social .pinterest{
background-color:#FF0000;
background-position:0 -80px;
}
.social .email{
background-color:#00FF00;
background-position:0 -120px;
}
.social .rss{
background-color:#ffba16;
background-position:0 -160px;
}
.social a{
/*--code trước--*/
z-index:1;
-moz-transition:color 0.4s ease;
-webkit-transition:color 0.4s ease;
-o-transition:color 0.4s ease;
transition:color 0.4s ease;
}
.social span{
/*--code trước--*/
z-index:-1;
opacity:0.8;
-moz-transition:opacity 0.4s ease,width 0.4s ease;
-webkit-transition:opacity 0.4s ease,width 0.4s ease;
-o-transition:opacity 0.4s ease,width 0.4s ease;
transition:opacity 0.4s ease,width 0.4s ease;
}
.social a:hover{
color:white;
text-shadow:0 1px 0 rgba(0,0,0,0.5);
}
.social a:hover span{
width:300px;
opacity:1;
}
]]></b:skin>
Friends this is a good media player to use in your blogger. .It is very easy to use and very attractive. Add this widget and enjoy.Keep follow this post.
<script type="text/javascript" src="http://mediaplayer.yahoo.com/js"></script>
<a href="Your mp3 direct URL">Mp3 file name</a>
Replace Your mp3 direct URL with your mp3 URL.
Replace Mp3 file name with your Mp3 song name.
Leave Your Comments…………………………..
<a class="duy-button" href="http://demo.com" target="_blank">DEMO</a>
There are four color classes available – blue, green, orange and gray. The rest of the classes, which you see assigned to the links above, are optional. You can choose a size from small, medium and big, and one more class – rounded, which creates a more rounded version of the button.
.duy-button{
font:15px Calibri, Arial, sans-serif;
text-shadow:1px 1px 0 rgba(255,255,255,0.4);
text-decoration:none !important;
white-space:nowrap;
display:inline-block;
vertical-align:baseline;
position:relative;
cursor:pointer;
padding:10px 20px;
background-repeat:no-repeat;
background-position:bottom left;
background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJ2gC1G0w5EQFGDQ7u34s1hLJKLc1wmS6Ts44TybRfZFNf74UWi55bCLap-6yIoheLpJbnqbAdjh96BKH9BbepU4fqNfOfjA1v2MkOWKmNATbaAJiUc54mugAtCLeJzuv3sC6ZMrG-A78y/s144/button_bg.png');
background-position:bottom left, top right, 0 0, 0 0;
background-clip:border-box;
-moz-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
-moz-box-shadow:0 0 1px #fff inset;
-webkit-box-shadow:0 0 1px #fff inset;
box-shadow:0 0 1px #fff inset;
-webkit-transition:background-position 1s;
-moz-transition:background-position 1s;
transition:background-position 1s;
height:150;
width:200px;
font-size:25px;
}
.duy-button:hover{
background-position:top left;
background-position:top left, bottom right, 0 0, 0 0;
}
.duy-button:active{
bottom:-1px;
}
/* The three buttons sizes */
.duy-button.big { font-size:30px;}
.duy-button.medium { font-size:18px;}
.duy-button.small { font-size:13px;}
/* BlueButton */
.duy-button{
color:#0f4b6d !important;
border:1px solid #84acc3 !important;
background-color: #48b5f2;
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJ2gC1G0w5EQFGDQ7u34s1hLJKLc1wmS6Ts44TybRfZFNf74UWi55bCLap-6yIoheLpJbnqbAdjh96BKH9BbepU4fqNfOfjA1v2MkOWKmNATbaAJiUc54mugAtCLeJzuv3sC6ZMrG-A78y/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJ2gC1G0w5EQFGDQ7u34s1hLJKLc1wmS6Ts44TybRfZFNf74UWi55bCLap-6yIoheLpJbnqbAdjh96BKH9BbepU4fqNfOfjA1v2MkOWKmNATbaAJiUc54mugAtCLeJzuv3sC6ZMrG-A78y/s144/button_bg.png'),
-moz-radial-gradient( center bottom, circle,
rgba(89,208,244,1) 0,rgba(89,208,244,0) 100px),
-moz-linear-gradient(#4fbbf7, #3faeeb);
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJ2gC1G0w5EQFGDQ7u34s1hLJKLc1wmS6Ts44TybRfZFNf74UWi55bCLap-6yIoheLpJbnqbAdjh96BKH9BbepU4fqNfOfjA1v2MkOWKmNATbaAJiUc54mugAtCLeJzuv3sC6ZMrG-A78y/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJ2gC1G0w5EQFGDQ7u34s1hLJKLc1wmS6Ts44TybRfZFNf74UWi55bCLap-6yIoheLpJbnqbAdjh96BKH9BbepU4fqNfOfjA1v2MkOWKmNATbaAJiUc54mugAtCLeJzuv3sC6ZMrG-A78y/s144/button_bg.png'),
-webkit-gradient( radial, 50% 100%, 0, 50% 100%, 100,
from(rgba(89,208,244,1)), to(rgba(89,208,244,0))),
-webkit-gradient(linear, 0% 0%, 0% 100%, from(#4fbbf7), to(#3faeeb));
}
.duy-button:hover{
background-color:#63c7fe;
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJ2gC1G0w5EQFGDQ7u34s1hLJKLc1wmS6Ts44TybRfZFNf74UWi55bCLap-6yIoheLpJbnqbAdjh96BKH9BbepU4fqNfOfjA1v2MkOWKmNATbaAJiUc54mugAtCLeJzuv3sC6ZMrG-A78y/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJ2gC1G0w5EQFGDQ7u34s1hLJKLc1wmS6Ts44TybRfZFNf74UWi55bCLap-6yIoheLpJbnqbAdjh96BKH9BbepU4fqNfOfjA1v2MkOWKmNATbaAJiUc54mugAtCLeJzuv3sC6ZMrG-A78y/s144/button_bg.png'),
-moz-radial-gradient( center bottom, circle,
rgba(109,217,250,1) 0,rgba(109,217,250,0) 100px),
-moz-linear-gradient(#63c7fe, #58bef7);
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJ2gC1G0w5EQFGDQ7u34s1hLJKLc1wmS6Ts44TybRfZFNf74UWi55bCLap-6yIoheLpJbnqbAdjh96BKH9BbepU4fqNfOfjA1v2MkOWKmNATbaAJiUc54mugAtCLeJzuv3sC6ZMrG-A78y/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJ2gC1G0w5EQFGDQ7u34s1hLJKLc1wmS6Ts44TybRfZFNf74UWi55bCLap-6yIoheLpJbnqbAdjh96BKH9BbepU4fqNfOfjA1v2MkOWKmNATbaAJiUc54mugAtCLeJzuv3sC6ZMrG-A78y/s144/button_bg.png'),
-webkit-gradient( radial, 50% 100%, 0, 50% 100%, 100,
from(rgba(109,217,250,1)), to(rgba(109,217,250,0))),
-webkit-gradient(linear, 0% 0%, 0% 100%, from(#63c7fe), to(#58bef7));
}