Membuat Tool Kode Warna Valid HTML5 dan Responsive di Blog - Setelah kemaren saya meng-share cara memasang tool kode warna di blog , tapi tutorial kemaren masih ada kekurangan yaitu belum valid , bagi anda yang ingin memasang tool kode warna di blog dan ingin tetap valid silahkan simak tutorialnya . tutoril ini saya ambil dari mas adhy pemilik blog kompi ajaib . namun kali ini saya menambahinya dengan membuat tool tersebut menjadi responsive . ini dia demo toolnya
Cara Memasang Tool Kode Warna di Blog
- Pertama ada pasang dulu CSS nya diatan kode
</style>
maupun]]></b:skin>
.color-code {
text-align:center;
margin:20px auto;
width:60%;
}
.color-responsive {
position:relative;
padding-bottom:100%;
height:0;
overflow:hidden;
}
.color-responsive object {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
border:0;
}NOTE:
Untuk mengatur width (lebar) Toll tersebut silahkan ubah ukuran 60 % pada kode berikut.color-code{text-align: center;margin:20px auto;width:60%;}
Silahkan sesuaikan dengan lebar halaman postingan Anda, jika tampilannya agak kecil silahkan tambahkan persentase-nya - Setelah anda memasang CSSnya sekarang saat anda pasang Html nya untuk memanggil Css tersebut
<div class="color-code">
<div class="color-responsive">
<object height="420" width="420" data="http://www.2createawebsite.com/build/color.swf"></object>
</div></div>
<div class="color-code">
<div class="color-responsive">
<object height="420" width="420" data="http://www.2createawebsite.com/build/col.swf"></object>
</div>
</div> - Langkah terakhir simpan template dan lihat hasilnya ( untuk hasilnya anda bisa lihat toll diatas
No comments: