Membuat sticky note dengan css

Membuat sticky note dengan css

417
0
SHARE

Untuk mempercantik tampilan halaman website atau aplikasi yang anda buat, anda dapat menambahkan sticky note. Anda bisa menggunakannya untuk menampilkan pesan pesan penting atau bahkan untuk membuat halaman login dengan form di dalamnya.

Berikut ini adalah contoh screenshot halaman login dengan sticky note yang telah saya buat.

login

Membuat sticky note dengan css

Untuk membuat sticky note dengan css caranya cukup mudah. Berikut ini adalah langkah-langkahnya.

Step 1: Buatlah file login.php

Step 2 : Tambahkan css berikut ini dalam element head.

Step 3 : Anda perlu mendownload font yang kita pakai yaitu Satisfy. Anda bisa mendownloadnya di sini kemudian letakkan dalam folder yang sama dengan file login.php yang tadi kita buat.

Jalankan file login.php dengan browser anda. Lihatlah hasilnya. Berikut ini adalah screenshot hasilnya.

login2
Anda bisa mengkreasikan cara tersebut sesuai kreatifitas anda. Misalnya dengan menambahkan background seperti screenshot di awal artikel ini. Cukup mudah bukan.

Semoga bermanfaat. Terima kasih telah berkunjung ke harviacode.com.

Bagikan artikel ini ya.. terima kasih

NO COMMENTS

LEAVE A REPLY