Pada kesempatan kali ini saya akan membahas tentang tampilan profile card, dalam desain Website Company tentu akan akan menampilkan beberapa profile orang yang memiliki pengaruh, contohnya CEO, Director, Manager, dll. dalam kasus kali ini saya akan membuat desain profile card dengan html css.

Bagaimana cara pembuatannya sahabat bisa ikuti langkah-langkah dalam dalam desainnya berikut ini:

Langkah pertama buat file html seperti bawah ini:

pada file html diatas saya menggunakan library bootstrap agar terlihat rapih ,dan saya menggunakan fontawesome untuk membuat icon yang dibutuhkan. disini saya akan menampilkan 4 profil saja,jadi hanya buth 4 image yang dipakai,nanti bisa sahabat ganti saja image yang dipakai.

ALngkah selanjutnya berikan style css untuk memberikan tampilanya yang cantik lagi, ketikkan code dibawah ini:

Jika kedua file diatas sudah diketikan coba buka ke sebuah browser maka apakah sudah seperti berikut tampilannya:

1-Cara desain profile card dengan html css

Sekarang coba mouse didekatkan ke salah satu profile maka akan seperti dibawah ini:

2-Cara desain profile card dengan html css

Demikian pembahasan artikel kali ini tentang cara membuat desain profile card dengan html css, semoga bermanfaat dan selamat mencoba.

terima kasih