Macam Mana Nak Buat Gambar/Photo Menjadi Bulat

Google Blog Press

Topik Kali ini ialah, bagaimana nak buat gambar menjadi bulat guna HTML/Javascript Tanpa Guna Photoshop

Demo klik disini > Contoh Web IRE

Apa yang anda perlukan ialah dengan menggunakan code CSS di bawah, Sila copy dan pastekan di atas code ]]></b:skin> dengan menngunakan CTRL+F dalam page template blog/web anda.

.image-cropper {
    width: 100px;
    height: 100px;
    position: relative;
    overflow: hidden;
    border-radius: 50%;
}

img {
    display: inline;
    margin: 0 auto;
    height: 100%;
    width: auto;
}

Kemudian langkah yang terakhir ialah dengan copy code di bawah dan pastekan dalam kotak widget html/javascript.

Sila gantikan image url  yang berwarna merah anda selepas src=" " dan sebelum class="rounded" />

<div class="image-cropper">
    <img src="http://www.googlebarcode.blogspot.com/Upload/Blogs/

smart-e-bike-side_2.jpg" class="rounded" />
</div>

Google Barcode