Hallo sahabat, pada kesempatan kali ini saya akan menjelaskan tentang property baru di CSS3 yaitu border-image. Border image ini berfungsi untuk menampilkan tampilan border yang berbeda dari biasanya yang hanya berupa garis lurus. Sekarang kita sudah bisa menyisipkan sebuah gambar untuk dijadikan sebuah border. Caranya sangat sederhana sekali, yaitu dengan menggunakan property border-image pada CSS3.

Sebelum memulai implementasi, sahabat simpan terlebih dahulu sebuah image yang akan di jadikan border. Misal saya akan menggunakan gambar berikut sebagai border.

Property Border Image CSS3

Baik, kita langsung saja implementasikan dengan membuat file .html dengan script sebagai berikut.

Property Border Image CSS3

Kemudian buatlah file .css dengan script sebagai berikut.

Property Border Image CSS3

Jika sudah, silahkan jalankan file .html nya pada browser, maka hasilnya akan seperti berikut.

Property Border Image CSS3

Mudah bukan? Silahkana sahabat kreasikan dengan kreasi versi sahabat. Selamat mencoba dan sampai jumpa pada tulisan selanjutnya 🙂