Laman

Saturday, January 7, 2017

Bootstrap Wells and Alerts (NT)

Nah gais saya Nicholas Tansol akan menjelaskan tentang Boostrap :D some instant thing that use for Design-ing ur web looks , tutorial kali ini saya akan menjelaskan Wells dan Alerts , cus lanjut ke tutorial :D

BOOTSTRAP WELLS

BS Wells digunakan untuk membuat sebuah rounded borders sekitar element HTML dengan warna backgroung abu-abu dan padding. Berikut contoh syntax dan hasil.


 
(Bagi kalian yang belum mempunyai boostrap silahkan bisa download disini)
Terdapat banyak jenis well tersedia dalam berbagai size seperti :
  • Small well
  • Normal well
  • Large well
Berikut contoh dari macam macam ukuran sebuah well :D :




Sekian tutorial saya tentang BS Wells sekarang kita akan lanjut ke Bootstrap Alerts.

BOOTSTRAP ALERTS

Alerts di BS memberikan kita kemudahan untuk membuat sebuah alerts dengan cara HANYA MEMANGGIL CLASS SAJA cukup mudah bukan? Tentu saja itulah fungsi dari BS untuk mempermudah pekerjaan Web Design kita :D, Terdapat 4 Jenis Alerts di BS yaitu :
  • alert alert-success : menandakan sebuah keberhasilan positif
  • alert alert-info : menandakan sebuah info penting
  • alert alert-warning : menandakan sebuah peringatan.
  • alert alert-danger : menandakan sebuah kegagalan / yang bersifat negatif
Berikut contoh-contoh syntax dan hasilnya :



Alert Links

Untuk menambahkan link yang sesuai dengan warna alert . Berikut contohnya :
 


Kita juga bisa membuat Alert yang dapat dihilangkan alias di-dismissable dengan cara menambahkan alert-dismissable setelah class alert-succcess/info/danger/warning dan menambahkan fungsi lain seperti data-dismiss dan aria-label seperti berikut:
 

Kamu juga dapat menambahkan efek Animasi fade in pada saat mengclose sebuah alert dengan fungsi fade in seperti berikut :
 
Sekian tutorial saya tentang BS Wells dan Alerts Semoga bermanfaat :D . Sekian dan Terima kasih!



No comments:

Post a Comment