Home TUTORIAL BLOGSPOT css3 box kode untuk css dan HTML/javascript

css3 box kode untuk css dan HTML/javascript

Posted by Unknown at 3:07 AM
Pure CSS Code Box for HTML/JavaScript Coding
Box kode css3
CSS3 Box Kode - hai sobat blogger ? apakah kalian sudah mempraktekkan trik blogspot / css3 terbaru ? trik ini adalah bagaimana cara membuat kode box untuk css dan HTML/javascript dengan style css3.caranya sebenarnya mudah kok.simak dulu tutorial ini.

Hasil :


code anda disini


Tutorial :

  • masuk akun blogger
  • ke menu edit html >> "expand template widget"
  • cari kode ]]></b:skin> dengan ctrl + f
  • pastekan kode berikut,diatasnya

.code-seohtc {
overflow:auto;width:503px;height:200px;
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(http://1.bp.blogspot.com/-nic37VqULoA/UDdTubWtwcI/AAAAAAAABbs/zv-i-PbnWHQ/s1600/labstrike-1.png) repeat-y top left;
border : 1px solid #000000;
border-left:20px solid #ccc;
-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
}
.code-seohtc:hover{
background : #000000 url(http://1.bp.blogspot.com/-alUx-JlZsZw/UDdT4qYXglI/AAAAAAAABb0/7ili3p2WHa4/s1600/labstrike-2.png) repeat-y top left;
color:#FEF9BF;
border : 1px solid #000;
border-left:20px solid #ccc;
-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;
}

  • simpan perubahan
  • sekarang , masuk ke postingan.
  • buat sebuah tutorial blogspot
  • lalu ketika ingin membuat kode yang akan dishare.
  • masukkan kode berikut

<div class="code-seohtc"> Your Code Here </div>


Note :
  • ganti kode yang berwarna merah dengan kode anda sendiri.
  • publikasikan dan lihat hasilnya

~ Happy Blogging - Ega Ariya Dirgantara ~
Pasang Iklan Anda

Tidak ada komentar untuk " css3 box kode untuk css dan HTML/javascript "

Back to Top