" NEW " Cara Membuat Blockquote Dengan Efek Lampu Menyala ( Arahkan Kursor )

" NEW " Cara Membuat Blockquote Dengan Efek Lampu Menyala ( Arahkan Kursor )

*  Buka blog mu
*  Klik template
*  Edit HTTML
*  Cari kode ini ]]></b:skin>
*  Copy kode di bawah dan letakkan diatas kode ]]></b:skin>
blockquote {
overflow:auto;width:600px;
font-family: "Consolas", "Courier New", Courier, mono, serif;
color:#848176;
margin : 15px 35px 15px 15px;
padding : 10px 10px 10px 35px;
clear : both;
list-style-type : none;
background : #000000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwuuNf0O7Ze-yqEUVdOYFXuRt7cwAxXu7TlROBK9UVpeOIgP_JHTwSvczlfowtFvedNY4JHnajsnGAk84zTx38cVA8ctogFFyZ5hhOhrgE0L0D03-QM9QQ5hJ1glUDDdKqrLG_C6DVnSso/s1600/rb+light+bulb.jpg) repeat-y top left;
border : 1px solid #000000;
border-left:20px solid #ff0000;
-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition-duration:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-border-radius:3px;-moz-border--moz-border-radius: 23px 20px 20px 20px;border-radius: 23px 20px 20px
}
blockquote:hover{
background : #000000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhY7QDlbpO7RKYImoLgw74hvwmaoa3QSPqpwoWbGmebMW08O03o38wIq1ak3s8bk5Ze4RAjuYHjtRiD5jQAfI2nvCKMXi5yimmDKryRCIAFKkP2baEzdfIpbya8NJMbXXs5tyM5sXChIZrU/s1600/rb+light+bulb+2.jpg) repeat-y top left;
color:#ff0000;
border : 1px solid #000;
border-left:20px solid #;
-webkit-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
-moz-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
box-shadow: 10px 10px 5px #888888;
}
*  Kemudian masukkan kode di bawah ke dalam HTML
<blockquote>TULIS TEXT ATAU KODE DISINI</blockquote>
*  Jangan lupa di save

###  GOOD  LUCK  ###

Baca Juga Artikel Terkait Lainnya

1 komentar:

Thanks For Your Comment Here