Asal
Bootstrap dikembangkan oleh Mark Otto dan Jacob Thornton di Twitter
sebagai kerangka untuk mendorong konsistensi di alat internal.
Sebelum Bootstrap, berbagai perpustakaan yang digunakan untuk
pengembangan antarmuka, yang menyebabkan inkonsistensi dan beban
pemeliharaan tinggi. Menurut Twitter pengembang Mark Otto:
- "Sekelompok super kecil dari pengembang dan aku bersama-sama untuk merancang dan membangun sebuah perangkat internal baru dan melihat kesempatan untuk melakukan sesuatu yang lebih. Melalui proses itu, kita melihat diri kita membangun sesuatu yang jauh lebih besar daripada perangkat internal lain. Beberapa bulan kemudian, kami akhirnya dengan versi awal Bootstrap sebagai cara untuk mendokumentasikan dan berbagi pola desain umum dan aset dalam perusahaan. "
Penyebaran pertama di bawah kondisi nyata yang terjadi selama Twitter pertama Hackweek. Mark Otto menunjukkan beberapa rekan bagaimana untuk mempercepat pembangunan proyek mereka dengan bantuan toolkit. Akibatnya, puluhan tim telah pindah ke kerangka.
Pada bulan Agustus 2011, Twitter merilis Bootstrap sebagai open source. Pada bulan Februari 2012, itu adalah proyek pengembangan GitHub paling membintangi, posisi masih memegang pada bulan Juni 2014.
Fitur
Bootstrap kompatibel dengan versi terbaru dari semua browser utama. Ini anggun mendegradasi bila digunakan pada browser lama seperti Internet Explorer 8.
Sejak versi 2.0 juga mendukung desain web responsif .
Ini berarti tata letak halaman web secara dinamis menyesuaikan, dengan
mempertimbangkan karakteristik dari perangkat yang digunakan (desktop,
tablet, ponsel).
Dimulai dengan versi 3.0, Bootstrap mengadopsi mobile pertama filosofi desain, menekankan desain responsif secara default.
Bootstrap adalah open source dan tersedia di GitHub. Pengembang didorong untuk berpartisipasi dalam proyek dan membuat kontribusi mereka sendiri untuk platform.
Baru-baru ini, anggota masyarakat telah diterjemahkan dokumentasi Bootstrap ke dalam berbagai bahasa, termasuk Cina , Spanyol dan Rusia .
Struktur dan fungsi
Bootstrap adalah modular dan pada dasarnya terdiri dari serangkaian stylesheet KURANG yang menerapkan berbagai komponen toolkit. Sebuah stylesheet disebut bootstrap.less mencakup komponen-komponen stylesheet. Pengembang dapat menyesuaikan file Bootstrap sendiri, memilih komponen yang ingin mereka gunakan dalam proyek mereka.
Penyesuaian yang mungkin sampai batas tertentu melalui stylesheet konfigurasi pusat. Perubahan yang lebih mendalam adalah mungkin dengan deklarasi KURANG.
Penggunaan bahasa stylesheet KURANG memungkinkan penggunaan variabel, fungsi dan operator, penyeleksi bersarang, serta disebut mixin .
Sejak versi 2.0, konfigurasi Bootstrap juga memiliki khusus "Customize" pilihan dalam dokumentasi.
Selain itu, pengembang memilih pada formulir komponen yang diinginkan
dan menyesuaikan, jika perlu, nilai-nilai berbagai pilihan untuk
kebutuhan mereka. Paket kemudian dihasilkan sudah termasuk pre-built style sheet CSS.
Sistem Grid dan desain responsif datang standar dengan 1170 pixel lebar, layout grid. Atau, pengembang dapat menggunakan tata letak variabel-lebar.
Untuk kedua kasus, toolkit memiliki empat variasi untuk menggunakan
resolusi yang berbeda dan jenis perangkat: ponsel, portrait dan
landscape, tablet dan PC dengan resolusi rendah dan tinggi. Setiap variasi menyesuaikan lebar kolom.
CSS stylesheet
Bootstrap menyediakan satu set stylesheet yang memberikan definisi gaya dasar untuk semua komponen HTML kunci. Ini menyediakan seragam, penampilan modern untuk teks format, tabel dan elemen form.
Komponen dapat digunakan kembali
Selain elemen HTML biasa, Bootstrap mengandung elemen antarmuka yang umum digunakan.
Ini termasuk tombol dengan fitur-fitur canggih (misalnya pengelompokan
tombol atau tombol dengan opsi drop-down, membuat dan daftar navigasi,
tab horizontal dan vertikal, navigasi, navigasi breadcrumb, pagination,
dll), label, kemampuan tipografi maju, thumbnail, pesan peringatan dan
progress bar.
JavaScript komponen
Bootstrap dilengkapi dengan beberapa komponen JavaScript dalam bentuk jQuery plugin. Mereka menyediakan elemen antarmuka pengguna tambahan seperti kotak dialog, tooltips, dan komidi putar.
Mereka juga memperluas fungsionalitas dari beberapa elemen antarmuka
yang ada, termasuk misalnya fungsi auto-lengkap untuk bidang masukan.
Dalam versi 2.0, plugin JavaScript berikut ini didukung: Modal,
Dropdown, Scrollspy, Tab, Tooltip, Popover, Alert, Button, Tutup,
Carousel dan Typeahead.
Sebuah implementasi dari Twitter Bootstrap menggunakan Toolkit Dojo juga tersedia. Hal ini disebut Dojo Bootstrap dan merupakan pelabuhan plugin Twitter Bootstrap. Menggunakan kode Dojo 100% dan memiliki dukungan untuk AMD ( Asynchronous Modul Definition ).
Demikian juga, Bootstrap kontrol untuk AngularJS juga tersedia; mereka disebut UI Bootstrap. Port ini menggunakan kembali beberapa markup Bootstrap ..
Gunakan
Untuk menggunakan Bootstrap dalam HTML halaman, pengembang mendownload Bootstrap CSS stylesheet dan termasuk link dalam HTML berkas.
(Pengembang juga dapat mengkompilasi CSS file dari download KURANG atau SASS stylesheet, dengan compiler khusus.)
Jika pengembang ingin menggunakan komponen JavaScript, mereka harus dirujuk bersama dengan jQuery perpustakaan dalam dokumen HTML.
Contoh berikut menggambarkan bagaimana ini bekerja. Kode HTML mendefinisikan bentuk pencarian sederhana dan daftar hasil dalam bentuk tabel. Halaman ini terdiri dari 5 elemen HTML dan CSS informasi sesuai dengan dokumentasi Bootstrap. Angka ini menunjukkan representasi dari dokumen dalam Mozilla Firefox 10 .
Latihanku.
0 komentar:
Posting Komentar