Μερικά Button για την σελίδα σας!

Μερικά Button για την σελίδα σας!

Αντιγραφή τον παρακάτω κώδικα:

<style>
/* foulscode.blogspot.gr */
/* Base */
html {
    padding: 0.125em;
    font-size: 200%;
}


/* Button */
.btn {
    margin: 0.25em;
    float: left;
    clear: both;
    font-family: monospace;
    white-space: nowrap;
}


/* Button elements */
.btn > span,
.btn--icon > i {
    padding: 0.5em 1em;
    display: inline-block;
    transition: 0.25s all;
}
.btn > span {
    border-radius: 0.25em;
    white-space: nowrap;
    color: #222;
    background: #ddd;
}
.btn:hover > span,
.btn:focus > span {
    background: lightgreen;
}
.btn:active > span {
    background: limegreen;
    transition: none;
}


/* Button with an icon */
.btn--icon > i {
    border-radius: 0.25em 0 0 0.25em;
    position: relative;
    font-weight: bold;
    font-style: normal;
    color: white;
    background: #222;
}
.btn--icon > i:after {
    content: "";
    border: 0.35em solid;
    border-color: transparent transparent transparent #222;
    position: absolute;
    top: 0.775em;
    right: -0.65em;
}
.btn--icon:hover > i,
.btn--icon:focus > i {
    color: #ddd;
}
.btn--icon > span {
    border-radius: 0 0.25em 0.25em 0;
}


/* Button custom states */
.btn--favorite:hover > i,
.btn--favorite:focus > i { color: gold; }
.btn--add:hover > i,
.btn--add:focus > i { color: lightblue; }
.btn--delete:hover > i,
.btn--delete:focus > i { color: orangered; }
.btn--favorite > span { background: gold; }
.btn--add > span { background: lightblue; }
.btn--delete > span { background: orangered; }
</style>
<a class="btn  btn--icon  btn--favorite" href=URL><i>$</i><span>Favorite</span></a>
<a class="btn  btn--icon  btn--add" href=URL><i>+</i><span>Add</span></a>
<a class="btn  btn--icon  btn--delete" href=URL><i>×</i><span>Delete</span></a>
<a class="btn  btn--icon" href=URL><i>More</i><span>Default</span></a>
<a class="btn  btn--add" href=URL><span>Iconless</span></a>

DEMO





Και αφού αλλάξετε τα μαρκαρισμένα γράμματα με τα δικά σας είστε έτοιμοι να κάνετε αποθήκευση.