Cara Membuat Gambar Bulat dengan Kode CSS

15 Feb 2017 - - 3

Biar blog lebih keren, anda bisa menambahkan foto profil anda di sidebar kanan, atau kiri blog anda, jika tampilan gambar profil anda di blog biasa saja, tentu kurang menarik, nah, biar lebih menarik walaupun gambar yang anda upload bentuknya persegi, dengan bantuan kode CSS ini, gambar profil keren anda akan tampil tambah keren.
Contohnya sebagai berikut:

Hasilnya setelah menggunakan tambahan kode CSS menjadi seperti berikut:

Bagaimana? anda tertarik ingin mencobanya? silahkan ikuti petunjuk berikut:
Cara Membuat Gambar Bulat dengan CSS, 
1. Login ke blogger.com dengan email dan password anda
2. Masuk tata letak blog anda
3. Tambahkan gadget HTML/ Javascript, kemudian copy kode dibawah ini:

<style>
.bulat{
border-radius:100em;
opacity:0.7;
border-top:2px solid #cf2031;
border-right:2px solid #0f7dc8;
border-bottom:2px solid #2eb31a;
border-left:2px solid #eab823;
width:160px;
height:160px;
}
</style>
<img class="bulat" src="URL-GBR" />

4. Ganti URL-GBR dengan url gambar anda (baca cara mendapatkan hosting gambar gratis di sini).
5. Simpan Gadget anda.

Demikian, semoga bermanfaat.