Αυτό είναι δροσερό το κουμπί CSS. Θα περιλαμβάνει με δροσερό
αιωρείται style.You να προσθέσετε αυτό το κουμπί κάθε περίπτωση
στο blog σας με αυτό το code.Follow αυτά τα βήματα
για να το προσθέσετε στο blog σας.
1. Συνδεθείτε στο λογαριασμό blogger και Πηγαίνετε στο Σχεδιασμός >> Επεξεργασία HTML
2. Βρες αυτή την ετικέτα με τη χρήση του Ctrl + F ]]></b:skin>
. 3 Επικόλληση παρακάτω κώδικα πριν ]]></b:skin> tag
Τώρα μπορείτε να αποθηκεύσετε το πρότυπό σας.
Όταν θέλετε να το προσθέσετε στο blog σας. Χρησιμοποιήστε το όπως παρακάτω
<a href="YOUR LINK " class="hb-buttons">Button name</a>
Όταν θέλετε να προσθέσετε χρήσης κουμπί παραπάνω σύνδεσμο και.
* Αντικαταστήστε
* Αντικαταστήστε
αιωρείται style.You να προσθέσετε αυτό το κουμπί κάθε περίπτωση
στο blog σας με αυτό το code.Follow αυτά τα βήματα
για να το προσθέσετε στο blog σας.
1. Συνδεθείτε στο λογαριασμό blogger και Πηγαίνετε στο Σχεδιασμός >> Επεξεργασία HTML
2. Βρες αυτή την ετικέτα με τη χρήση του Ctrl + F ]]></b:skin>
. 3 Επικόλληση παρακάτω κώδικα πριν ]]></b:skin> tag
.hb-buttons{
background-color:#4b3f39;
font-family: 'Verdana', sans-serif;
font-size:12px;
text-decoration:none;
color:#fff;
position:relative;
padding:10px 20px;
padding-right:50px;
background-image: linear-gradient(bottom, rgb(62,51,46) 0%, rgb(101,86,78) 100%);
border-radius: 5px;
box-shadow: inset 0px 1px 0px #9e8d84, 0px 5px 0px 0px #322620, 0px 10px 5px #999;
}
.hb-buttons:active {
top:3px;
background-image: linear-gradient(bottom, rgb(62,51,46) 100%, rgb(101,86,78) 0%);
box-shadow: inset 0px 1px 0px #9e8d84, 0px 2px 0px 0px #322620, 0px 5px 3px #999;
}
.hb-buttons:before {
background-color:#322620;
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguixxtbzIsA-uRtIjcoBjMo2iz7UVXqseK-8gf_1wET1_xWjeYR-4H3Gdaj_iVxl0dDlwiy5oxWX3cx-0COCNRgAeIr1ePUmOZu9Q6imIIKc1N-7sQepXluWXr-2ufipnzKtEHjN5d-u4/h80/helper-blogger-right-arrow.png);
background-repeat:no-repeat;
background-position:center center;
content:"";
width:20px;
height:20px;
position:absolute;
right:15px;
top:50%;
margin-top:-9px;
border-radius: 50%;
box-shadow: inset 0px 1px 0px #19120f, 0px 1px 0px #827066;
}
.hb-buttons:active::before {
top:50%;
margin-top:-12px;
box-shadow: inset 0px 1px 0px #827066, 0px 3px 0px #19120f, 0px 6px 3px #382e29;
}
Τώρα μπορείτε να αποθηκεύσετε το πρότυπό σας.
Όταν θέλετε να το προσθέσετε στο blog σας. Χρησιμοποιήστε το όπως παρακάτω
<a href="YOUR LINK " class="hb-buttons">Button name</a>
Όταν θέλετε να προσθέσετε χρήσης κουμπί παραπάνω σύνδεσμο και.
* Αντικαταστήστε
τη σύνδεσή σας
με το URL σας
* Αντικαταστήστε
το όνομα Button
με οποιοδήποτε όνομα θέλετε. Done, Cheers.
Δεν υπάρχουν σχόλια:
Δημοσίευση σχολίου