Fitur-fitur Bootstrap ~ Justicle

30 Mei 2014

Fitur-fitur Bootstrap

Jumat, Mei 30, 2014

Anjar Kusworo

No comments

Source Bootstrap

Yang perlu anda lakukan untuk bisa memanfaatkan bootstrap ini adalah mendownload file-file bootstrap dari Twitter, anda dapat mendownloadnya di sini.
Jika anda sudah mendownloadnya, maka anda akan melihat sebuah file zip, bernama bootstrap.zip, yang mana jika di-extract akan menjadi sebuah folder Bootstrap, yang terdiri atas beberapa file berikut :

Struktur Bootstrap
Struktur bootstrap tersebut dapat digambarkan sebagai berikut :
bootstrap/

+-- css/
¦ +-- bootstrap.css
¦ +-- bootstrap.min.css
+-- js/
¦ +-- bootstrap.js
¦ +-- bootstrap.min.js

Dari struktur bootstrap di atas, maka jika kita ingin memanfaatkan Bootstrap untuk layout website kita, kita pasti faham, di mana seharusnya file kita diletakkan.

Docs Section

Berikut adalah beberapa fitur untuk layout website yang disediakan oleh bootstrap :

Scaffoling : Bagian yang mengatur background, link styles, grid system, dan two simple layouts
Base CSS : Bagian yang mengatur tampilan elemen HTML seperti typography, code, table, form, dan button. Termasuk Glyphicons, sebuah kumpulan ikon-ikon kecil.
Components : Bagian yang mengatur tampilan component, seperti tab, navbar, alerts, page headers, dst.
Javascript Plugins: Menyediakan beberapa component interaktif, seperti tooltips, popovers, modals, dan seterusnya.

Daftar Component Bootstrap

Berikut adalah Component dan Javascript plugin yang didukung oleh Bootstrap:

Button groups
Button dropdowns
Navigational tabs, pills, and lists
Navbar
Labels
Badges
Page headers and hero unit
Thumbnails
Alerts
Progress bars
Modals
Dropdowns
Tooltips
Popovers
Accordion
Carousel
Typeahead

Cara menggunakan Boostrap

Untuk membuat layout website menggunakan bootstrap, sama dengan ketika mendesain menggunakan HTML dan CSS biasa. Pada dokumen HTML, kita hanya perlu menambahkan pada bagian <head> </head> dan pada bagian <body> </body> beberapa elemen berikut :