Bootstrap Part 4 : Membuat Tombol Dengan Bootstrap


Membuat Tombol Dengan Bootstrap

Selain mampu mendesign tampilan table, menu navigasi dan lain-lainnya, bootstrap juga memiliki kemampuan untuk mendesign tombol atau hyperlink. dan cara membuat tombol dengan bootstrap juga sangat mudah. anda hanya tinggal menambahkan class “btn” untuk mendifinisikan element menjadi tombol, dan kemudian mengatur warna tombol yang anda inginkan, serta mengatur ukuran tombol yang anda inginkan.

Bootstrap menyediakan beberapa class yang bisa kita gunakan untuk mendesign atau menciptakan bentuk tombol yang menarik. berikut ini adalah beberapa class bootstrap yang bisa di gunakan untuk membuat tombol, mengatur ukuran dan mengatur warna dari tombol tersebut.

  • .btn
    btn merupakan class bootstrap yang bisa di gunakan untuk membuat tombol.
  • .btn-xs
    btn-xs merupakan class bootstrap untuk membuat tombol dengan ukuran sangat kecil atau extra kecil.
  • .btn-sm
    btn-sm merupakan class bootstrap untuk membuat tombol dengan ukuran yang kecil.
  • .btn-md
    btn-md merupakan class bootstrap untuk membuat tombol dengan ukuran sedang.
  • .btn-lg
    btn-lg merupakan class bootstrap untuk membuat tombol dengan ukuran besar.
  • .btn-danger
    btn-danger merupakan class bootstrap untuk membuat tombol berwarna merah.
  • .btn-default
    btn-default merupakan class bootstrap untuk membuat tombol dengan warna standar bootstrap.
  • .btn-warning
    btn-warning merupakan class bootstrap untuk membuat tombol berwarna kuning.
  • .btn-primary
    btn-primary merupakan class bootstrap untuk membuat tombol berwarna biru.
  • .btn-info
    btn-danger merupakan class bootstrap untuk membuat tombol berwarna biru langit.
  • .btn-success
    btn-success merupakan class bootstrap untuk membuat tombol berwarna hijau.

Cara membuat tombol dengan bootstrap

Untuk membuat tombol dengan bootstrap anda bisa menggunakan tag



Diki Alfarabi Hadi

Coding enthusiast.Someone who love learn something new. especially about web programming and web design. happy to share about knowledge and learn from other.

TUTORIAL MENARIK LAINNYA

membuat template blog sederhana dengan bootstrap
mengenal grid system bootstrap
Diskusi
Tidak Ada Komentar

Tulis Komentar / Pertanyaan

Your email address will not be published. Required fields are marked *