About

Monday, April 3, 2017

Belajar Bootstrap Part 4 Membuat Button Dengan Bootstrap

Belajar Bootstrap Part 4 Membuat Button Dengan Bootstrap



Assalamualaikum Wr. Wb.

Hai Sobat, Pada kesempatan kali ini saya akan menjelaskan tentang penggunaan bootstrap untuk membuat sebuat tombol atau biasa dikenal dengan button. Berikut penjelasannya.

PENGERTIAN

Bootstrap adalah sebuah framework CSS yang berfungsi untuk membuat tampilan website menjadi Responsive atau dapat menyesuaikan pada semua ukuran layar monitor. Pada Bootstrap sendiri sudah menyediakan UI (User Interface) bawaan dari Bootstrap salah satunya adalah Button.

Di Bootstrap Button terdapat 6 macam yaitu :


1. button-primary

2. button-info

3. button-default

4. button-success

5. button-danger

6. button-warning
 

LATAR BELAKANG

Ingin mempermudah dalam pembuat sebuah button, tanpa harus membuat CSS dalam mendesain tampilannya.

MAKSUD & TUJUAN 
  • Mempermudah dalam pembuatan button atau tombol di dalam HTML.
  • Dapat menentukan desain sesuai keinginan kita tanpa membuat CSS terlebih dahulu.

ALAT & BAHAN
  • PC/LAPTOP
  • Text Editor
  • Browser
LANGKAH KERJA

Untuk cara membuatnya anda bisa menggunakan Code Html menggunakan class atau type:

<body>
<button class=”btn btn-default”>Button</button>
<button class=”btn btn-info”>Button</button>
<button class=”btn btn-primaryt”>Button</button>
<button class=”btn btn-succes”>Button</button>
<button class=”btn btn-danger”>Button</button>
<button class=”btn btn-warning”>Button</button>
</body>

anda bisa juga menggunakan Code seperti ini :

<button type=“button” class=“btn btn-default”>Default</button>
<button type=“button” class=“btn btn-primary”>Primary</button>
<button type=“button” class=“btn btn-success”>Success</button>
<button type=“button” class=“btn btn-info”>Info</button>
<button type=“button” class=“btn btn-warning”>Warning</button>
<button type=“button” class=“btn btn-danger”>Danger</button>
<button type=“button” class=“btn btn-link”>Link</button>
Setelah anda membuat Code seperti itu coba anda save lalu lihat perubahannya di browser yang anda gunakan. Sekian untuk artikel mengenai button Bootstrap,semoga bermafaat.
Referensi



Faiz Ahmad

About Faiz Ahmad

Faiz Ahmad. Salatiga, 28 Juni 2000. Saya hanya seorang Hamba Allah yang masih banyak kekurangan, maka dari itu saya ingin menutupi kekurangan saya dengan melakukan hal yang bermanfaat kepada orang lain. Seperti filosofi tanah “Bermanfaat untuk orang sebanyak mungkin, namun dikenal oleh orang sesedikit mungkin”. Pernahkah kita mengingat jasa tanah? Sedetik saja dalam sehari? Saya rasa hanya sedikit sekali yang mengingatnya, berbeda dengan matahari yang jasanya selalu kita ingat. Padahal kita semua tentu tahu bagaimana jadinya dunia ini jika tidak ada tanah.

Subscribe to this Blog via Email :