Home‎ > ‎Open Source‎ > ‎

Snippets

 [class^="glyphicon-"],[class*=" glyphicon-"] {
    display:inline-block;
    width:14px;height:14px;
    *margin-right:.3em;
    line-height:14px;
    vertical-align:text-top;
    background-image:url("glyphicon.png");
    background-repeat:no-repeat;
}
[class^="glyphicon-"]:last-child,[class*=" glyphicon-"]:last-child {
    *margin-left:0;
}
.glyphicon-glass { background-position: 0 0 }
.glyphicon-leaf { background-position: -34px 0 }
.glyphicon-dog { background-position: -68px 0 }
.glyphicon-user { background-position: -102px 0 }
.glyphicon-girl { background-position: -136px 0 }
.glyphicon-car { background-position: -170px 0 }
.glyphicon-user-add { background-position: -204p
    
     
     
     
     
     
body {
background-image: url(img/betweengrassandsky.png);
background-repeat: no-repeat;
background-color: #EEE;
background-size: cover;
}

#examplen {
width: 580px;
height: 200px;
background-image: url(img/sheep.png), url(img/sheep.png), url(img/betweengrassandsky.png);
background-repeat: no-repeat;
background-position: 20px 100px, 400px 50px, center bottom;
background-color: #EEE;
background-size: 70px, auto, cover;
}
<audio style="width: 500px;" autoplay="true" controls="true"><source src="http://k007.kiwi6.com/hotlink/ce04pwczzb/finished.mp3"></audio>

You can define your own custom CSS style.

HTML

<button class="btn btn-lg btn-custom" type="button">
    <span class="glyphicon glyphicon-star"></span>
</button>

CSS

.btn-custom {  
    background-color: #FFFFFF;
    border-color: #CCCCCC;
    color: #333333;
 }
.btn-custom:hover {
   background-color: #000;
   border-color: #fff;
   color: #333333;
}
Comments