Pengaturan Margin dan Padding di Bootstrap - THEMASDOYOK.COM |
Pengaturan Margin dan Padding di Bootstrap Posted: 25 Aug 2013 05:06 PM PDT Pengaturan Margin dan Padding di Bootstrap - Bootstrap v3 telah dikembangkan. Versi ini memungkinkan responsibility di berbagai device seperti mobile, tablet dan desktop tanpa pengaturan css manual. Sistem grid yang fleksibel memungkinkan kita mengatur lebar kolom yang akan menyesuaikan device tanpa penambahan rumus kondisional secara manual di blog. Saya mencoba membuat template full bootstrap, paling tidak dari segi CSS, sama sekali tidak ada CSS yang ditulis manual di blog, dan ternyata cukup membuat puyeng. Contoh project: http://project-bootstrap.blogspot.com/. Mungkin akan terjadi error atau apa, karena masih saya utak atik terus menerus sambil belajar. Template tersebut juga sudah lolos validasi HTML5. Sementara ini, lebih banyak kesulitan yang didapatkan ketimbang kelebihan yang saya rasakan ketika mencoba mengembangkan template berbasis bootstrap. Kode memang menjadi lebih ringkas dan tentu saja loading cepat, tapi belum keseluruhan class CSS bootstrap bisa mewakili kebutuhan desainer. Misalkan saja untuk masalah padding dan margin kita akan dibuat sangat ribet. Di web resmi bootstrap (getbootstrap.com), diajarkan tentang pergeseran widget ke kanan (bisa mewakili margin-left) menggunakan sistem offseting column, tapi untuk kebalikannya juga belum ada class standard yang bisa kita gunakan. Jadi, untuk menentukan margin dan padding kita harus memberikan tambahan kode CSS internal, seperti contoh: .selector { margin: 0px; padding: 0px; } Info Tentang: Pengaturan margin, padding dan color di Bootstrap |
Membuat Bootstrap di Blogger - Blogspot Posted: 25 Aug 2013 06:21 PM PDT Instal Bootstrap di Blogger Blog - Banyak pengguna blogger yang bingung soal bootstrap. Mungkin banyak yang mempunyai keinginan untuk aplikasikan bootstrap di blog blogspot mereka, tapi bingung step-step nya. Ya, sambil belajar bareng mari kita coba buat bootstrap di blogger. (Sebaiknya dibaca: Bootstrap belum tepat untuk blogspot). Tapi untuk belajar boleh juga lah, biar tidak ketinggalan jaman. Langkah-langkahnya: 1. Download File Bootstrap 2. Upload di Google Drive 3. Pemasangan di Blogspot Download File Bootstrap Untuk versi terbarunya bisa di download di https://github.com/ File nya terus di update, jadi nanti kita bisa ikuti perkembangannya. - Download file tersebut, hasil download berupa zip file - Extract file ke folder yang Anda tentukan. File zip tersebut terdiri dari file xss, images dan js Upload di Google Drive - Sementara 2 file aja dulu yang di upload di Google Drive. Baca Tutorial: Host JavaScript di Google Drive. - File yang diupload adalah file bootstrap.min.css dan bootstrap.min.js Pemasangan di Blogspot Nah, ini langkah terpenting. - Login Blogger - Klik Template - Klik Edit HTML - Masukkan script bootstrap yang sudah diupload di atas </head> Nah, setelah script ditambahkan Anda mulai bisa menggunakan class-class bootstrap. Kalau Mau Mudah, Kalau bingung cara upload file dan pasangnya, cukup tambahkan kode berikut ini di atas </head> <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css"/> <script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/> <script src='http://html5shim.googlecode.com/svn/trunk/html5.js' type='text/javascript'/> <link href='//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.min.css' rel='stylesheet'/> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"/> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"/> Jika, sudah silahkan Simpan Template Anda. Sekarang Anda mulai bisa menambahkan berbagai component dengan mudah. Untuk penambahan elemen silahkan lihat di: Componen . Btotstrap Sekarang sudah update versi 3: http://getbootstrap.com/ Item Info: Membuat Bootstrap di Blogger - Blogspot |
You are subscribed to email updates from THEMASDOYOK | Majalah Blogger | Modifikasi dan Tips Blogspot To stop receiving these emails, you may unsubscribe now. | Email delivery powered by Google |
Google Inc., 20 West Kinzie, Chicago IL USA 60610 |
0 komentar:
Posting Komentar