BOOTSTRAP NEDİR?
BOOTSTRAP NEDİR?
Web uygulamalarını ve web sitelerini daha hızlı,modern bir yapıyla oluşturulmasını sağlayan çok kodlamanın hazırlanmış halidir. Bootstrap,Twitter’ın Apache 2 lisansıyla açık kaynak yaptığı CSS,HTML araç kiti. CSS tarafından LESS’i kullanıyor.CSS ve JS hazır halde bulunuyor. Tasarım dilinde en çok kullanılan framework uygulamasıdır. Neleri kapsıyor
-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 ve her geçen gün şaşırtıcı yeniliklerle geliyorlar.
- Bootstrap ile CSS’ye tam anlamıyla hakim olabilirsiniz.
- Bootstrap GİTHUB tarafından açık kaynak olarak geliştirilmektedir.
- Bootstrap HTML5’in tüm özelliklerini destekler.
- Bootstrap ile oluşturulmak istenen projeler için özel olarak tasarlanmış JQuery eklentileri vardır.
TARAYICI DESTEĞİ Modern web tarayıcıları Chrome,Opera,Firefox 4+,Safari ve İnternet Explorer( :’( ) versiyonları destekler. 
yapılması gerekenler Twitter-Bootstrapı GİTHUB sayfasından inidirin ve klasörün içine oluşturmak istediğiniz HTML sayfasını yerleştirin. İndirmiş oldugunuz bu depo içinde Bootstrap’ın önemli dosyaları bulunmaktadır.Bu dosyalardan yararlanabilmek için HTML sayfasına bunların include edilmesi gerekmektedir. <head> .... </head>etiketleri arasına <link rel="stylesheet" href="docs/assets/css/bootstrap.css">bu ve daha kullanmak istediğimiz diğer css dosyalarını include ediyoruz.(dosya yoluna dikkat ediniz sizinki farklı olabilir.)aynı şekilde js kodlarıda; <script src="js/bootstrap.min.js"></script>Twitter Bootstrap, LESS’i (LESS ) destekliyor. LESS daha hızlı ve kolay web geliştirmek için bir CSS önişlemcisidir. O yüzden less css dosyasını ve less JS dosyasını, kendi HTML sayfanızda şu şekilde include edebilirsiniz: <link rel="stylesheet/less" href="less/bootstrap.less"><script src="/path/to/less.js"></script> Hemen birkaç örnek verelim.
basit bir html sayfası oluşumu
<html>
<head>
<link rel="stylesheet" href="docs/assets/css/bootstrap.css">
<link rel="stylesheet/less" href="less/bootstrap.less">
</head>
<body>
<div class="container">
<div class="span9">
<div class="hero-unit">
<p> MERHABA DÜNYA</p>
</div>
</div>
</div>
</body>
</html>
vurgulu yazılar
<p class="muted">sessiz.</p>
<p class="text-warning">uyarı.</p>
<p class="text-error">hata.</p>
<p class="text-info">haber.</p>
<p class="text-success">başarı.</p>
form örneği
<form class="form-horizontal">
<div class="control-group">
<label class="control-label" for="inputEmail">Email</label>
<div class="controls">
<input type="text" id="inputEmail" placeholder="Email">
</div>
</div>
<div class="control-group">
<label class="control-label" for="inputPassword">Password</label>
<div class="controls">
<input type="password" id="inputPassword" placeholder="Password">
</div>
</div>
<div class="control-group">
<div class="controls">
<label class="checkbox">
<input type="checkbox"> Remember me
</label>
<button type="submit" class="btn">Sign in</button>
</div>
</div>
</form>
button
<button type="button" class="btn btn-large btn-primary">Large button</button>
<button type="button" class="btn btn-large">Large button</button>
<button type="button" class="btn btn-primary">Default button</button>
<button type="button" class="btn">Default button</button>
<button type="button" class="btn btn-small btn-primary">Small button</button>
<button type="button" class="btn btn-small">Small button</button>
<button type="button" class="btn btn-mini btn-primary">Mini button</button>
<button type="button" class="btn btn-mini">Mini button</button>
vs… daha fazlası için.
- Bootstrap’ın resmi internet sitesi buyrun
- Bootstrap ile oluşturulmuş temalar buyrun
- Bootstrap ile oluşturulmuş web sitelerine buyrun
- Daha detaylı bilgi için resmi blog yazısına ulaşabilirsiniz. buyrun
- Ayrıca resmi sitesinde bulunan kodları daha sade şekilde yazmaya çalıştım.kodları için github depom (depomun gh-pages dalında) buyrun
- Ve demolarını görmek için buyrun
kullanım alanlarından bazıları
- Rails ve Bootstrap
- Jekyll-Bootstrap buyrun
- backbone.js + Boostrap ile Örnek Uygulaması buyrun
- Bootstrap ile hazır sistem. http://jetstrap.com/
- Bootstrap ile form yardımcıları BootstrapFormHelpers
- Kendi formunuzu kendiniz oluşturun bootstrap-forms
(bootstrap-forms örneği) 
- Bootstrap CMS Website temaları * * * (incelemenizi tavsiye ederim) Bootstrap temaları
- Basit bir şekilde web sitesi yapımı anlatımı http://sanalkurs.net/responsive-web-sitesi-yapiyoruz-ders-1-2-8320.html
Bu yazı http://tugdev.github.io/bootstrap/ adresinden alıntıdır.
