Konsultasikan kebutuhan website Anda, Hub. HP/WA. 0877 5996 9545

Kamis, 21 Desember 2017

Cara Membuat Gambar Bulat dengan CSS



Cara Membuat Gambar Bulat dengan CSS yaitu dengan membuat beberapa baris Code CSS saja, seperti di bawah ini.

Mengunakan Border warna warni

.bulat{
border-radius:100em;
opacity:0.5;
border-top:2px solid #cf2031;
border-right:2px solid #0f7dc8;
border-bottom:2px solid #2eb31a;
border-left:2px solid #eab823;
width:160px;
height:160px;
}

Tanpa Menggunakan Border

.bulat{
border-radius:100em;
opacity:0.5;
width:160px;
height:160px;
}

Menggunakan Border 1 Warna

.bulat{
border-radius:100em;
opacity:0.5;
border:2px solid #ddd;
width:160px;
height:160px;
}


Jika sobat ingin menerapkannya di blogger, begini caranya
Masuk ke Blogger => Template => Edit HTML
Kemudian pastekan salah satu code CSS di atas sebelum tag </style>
Kemudian save template.
Dan setiap sobat menampilkan gambar maka cukup tambahkan class bulat, contohnya seperti ini

<img class="bulat" src="LINK GAMBAR SOBAT" />

Catatan :

Untuk merubah ukuran gambar sobat tinggal mengganti value pada bagian width dan height namun ukurannya harus sama, jika width="120px" maka height juga harus 120px

Selamat Mencoba...!!!

Share:

0 komentar:

Posting Komentar


KONTAK


Zulkarnaen (Web Master)
Owner of PlasaWebsite.com

INFO & ORDER WEB HUB :

Telpon : 0877 5996 9545

SMS : 0877 5996 9545

WA : 0877 5996 9545

e-mail : plasawebsite@gmail.com

Jam Kerja :

Senin - Jum'at : 08.30 - 16.30 WIB

Sabtu, Minggu & Hari besar : TUTUP



REKENING BANK



Pembayaran silahkan transfer ke rekening :




Bank BCA
No. Rek. 440 1175 177
A/n. Zulkarnaen




Bank BRI
No. Rek.
3123-01-025927-53-1
A/n. Zulkarnaen

Translate

ORDER via WhatsApp



Bisa dari HP

Formulir Kontak

Nama

Email *

Pesan *

Total Tayangan Halaman

Flag Counter

Sejak 14 Des 2017