2011-04-27 13:53:51 -07:00
<!DOCTYPE html>
< html lang = "en" >
< head >
< meta charset = "utf-8" >
2011-08-19 22:28:22 -07:00
< title > Bootstrap, from Twitter< / title >
2011-08-20 18:58:12 -07:00
< meta name = "description" content = "" >
< meta name = "author" content = "" >
2011-04-27 13:53:51 -07:00
2011-09-17 17:21:43 -07:00
<!-- Le HTML5 shim, for IE6 - 8 support of HTML5 elements -->
2011-08-20 01:11:48 -07:00
<!-- [if lt IE 9]>
< script src = "http://html5shim.googlecode.com/svn/trunk/html5.js" > < / script >
<![endif]-->
2011-06-27 16:47:12 -07:00
<!-- Le styles -->
2011-09-15 23:09:56 -07:00
< link href = "../bootstrap.css" rel = "stylesheet" >
2011-08-19 14:23:41 -07:00
< link href = "assets/css/docs.css" rel = "stylesheet" >
2011-08-20 18:58:12 -07:00
< link href = "assets/js/google-code-prettify/prettify.css" rel = "stylesheet" >
2011-04-27 13:53:51 -07:00
2011-08-20 18:58:12 -07:00
<!-- Le fav and touch icons -->
2011-09-13 09:35:43 -07:00
< link rel = "shortcut icon" type = "image/x-icon" href = "assets/ico/favicon.ico" >
< link rel = "apple-touch-icon" href = "assets/ico/bootstrap-apple-57x57.png" >
< link rel = "apple-touch-icon" sizes = "72x72" href = "assets/ico/bootstrap-apple-72x72.png" >
< link rel = "apple-touch-icon" sizes = "114x114" href = "assets/ico/bootstrap-apple-114x114.png" >
2011-04-27 13:53:51 -07:00
< / head >
2011-08-26 00:00:05 -07:00
< body >
2011-04-27 13:53:51 -07:00
2011-10-17 20:44:52 -07:00
<!-- Navbar
2011-08-20 23:38:00 -07:00
================================================== -->
2011-10-11 09:44:51 -07:00
< div class = "navbar navbar-fixed" data-scrollspy = "scrollspy" >
< div class = "navbar-inner" >
2011-08-21 18:14:53 -07:00
< div class = "container" >
2011-10-17 00:03:52 -07:00
< a class = "brand" href = "./index.html" > Bootstrap< / a >
2011-08-26 20:38:23 -07:00
< ul class = "nav" >
2011-10-26 23:11:56 -07:00
< li class = "active" > < a href = "./index.html" > Overview< / a > < / li >
< li > < a href = "./scaffolding.html" > Scaffolding< / a > < / li >
< li > < a href = "./base-css.html" > Base CSS< / a > < / li >
< li > < a href = "./components.html" > Components< / a > < / li >
< li > < a href = "./javascript.html" > Javascript plugins< / a > < / li >
< li > < a href = "./less.html" > Using LESS< / a > < / li >
<!--
2011-09-10 22:31:43 -07:00
< li class = "active" > < a href = "#overview" > Overview< / a > < / li >
2011-08-21 18:14:53 -07:00
< li > < a href = "#about" > About< / a > < / li >
2011-10-11 09:44:51 -07:00
< li class = "dropdown" >
< a href = "#" class = "dropdown-toggle" data-dropdown = "true" > Scaffolding< / a >
2011-09-17 17:21:43 -07:00
< ul class = "dropdown-menu" >
< li > < a href = "#grid-system" > Grid< / a > < / li >
< li > < a href = "#layouts" > Layouts< / a > < / li >
2011-10-16 18:01:05 -07:00
< li > < a href = "#responsive" > Resposive< / a > < / li >
2011-09-17 17:21:43 -07:00
< / ul >
< / li >
2011-10-11 09:44:51 -07:00
< li class = "dropdown" >
< a href = "#" class = "dropdown-toggle" data-dropdown = "true" > CSS< / a >
2011-09-17 17:21:43 -07:00
< ul class = "dropdown-menu" >
< li > < a href = "#typography" > Type< / a > < / li >
< li > < a href = "#tables" > Tables< / a > < / li >
< li > < a href = "#forms" > Forms< / a > < / li >
< / ul >
< / li >
2011-10-11 09:44:51 -07:00
< li class = "dropdown" >
< a href = "#" class = "dropdown-toggle" data-dropdown = "true" > Patterns< / a >
2011-09-17 17:21:43 -07:00
< ul class = "dropdown-menu" >
2011-10-16 18:01:05 -07:00
< li > < a href = "#media" > Media< / a > < / li >
2011-10-19 23:12:50 -07:00
< li > < a href = "#navigation" > Navigation< / a > < / li >
2011-09-17 17:21:43 -07:00
< li > < a href = "#alerts" > Alerts< / a > < / li >
< li > < a href = "#popovers" > Popovers< / a > < / li >
2011-10-16 18:01:05 -07:00
< li > < a href = "#autocomplete" > Autocomplete< / a > < / li >
< li > < a href = "#accordion" > Accordion< / a > < / li >
< li > < a href = "#datepicker" > Datepicker< / a > < / li >
2011-09-17 17:21:43 -07:00
< / ul >
< / li >
2011-09-02 23:15:38 -07:00
< li > < a href = "#javascript" > Javascript< / a > < / li >
2011-10-16 18:01:05 -07:00
< li > < a href = "#less" > Using Less< / a > < / li >
2011-10-26 23:11:56 -07:00
-->
2011-08-21 18:14:53 -07:00
< / ul >
< / div >
2011-04-27 13:53:51 -07:00
< / div >
< / div >
2011-10-26 23:11:56 -07:00
< div class = "container" >
< div id = "overview" >
<!-- Masthead
================================================== -->
< header class = "jumbotron masthead" >
< div class = "inner" >
< h1 > Bootstrap,< br > from Twitter< / h1 >
< p class = "lead" > Bootstrap is a responsive frontend toolkit from Twitter designed to kickstart web development, complete with core HTML, CSS, and JS for grids, type, forms, navigation, and many more components.< / p >
< p class = "download-info" >
< a href = "#" class = "btn primary btn-large" > Download on GitHub< / a >
Currently v2.0.0
< / p >
< div class = "benefits" >
< h4 > Feature highlights< / h4 >
< ul >
< li > < span > × < / span > Built on LESS< / li >
< li > < span > × < / span > Complete styleguide docs< / li >
< li > < span > × < / span > Fully responsive design< / li >
< li > < span > × < / span > Small footprint (7kb gzipped)< / li >
< li > < span > × < / span > Support for IE7 and up< / li >
< li > < span > × < / span > Custom jQuery plugins< / li >
< li > < span > × < / span > Dozens of components< / li >
< / ul >
2011-09-29 01:40:27 -07:00
< / div >
< / div >
2011-10-26 23:11:56 -07:00
< / header >
< ul class = "quick-links" >
< li > < strong > Quick links< / strong > < / li >
< li > < a href = "https://github.com/twitter/bootstrap/" > GitHub< / a > < / li >
< li > < a href = "https://github.com/twitter/bootstrap/issues?state=open" > Issues< / a > < / li >
< li > < a href = "https://github.com/twitter/bootstrap/wiki/Roadmap" > Roadmap< / a > < / li >
< li > < a href = "https://github.com/twitter/bootstrap/wiki/Changelog" > Changelog< / a > < / li >
< li class = "divider" > · < / li >
< li > < strong > Authors< / strong > < / li >
< li > < a href = "http://twitter.com/mdo" > @mdo< / a > < / li >
< li > < a href = "http://twitter.com/fat" > @fat< / a > < / li >
< li class = "divider" > · < / li >
< li class = "follow-btn" >
< a href = "https://twitter.com/twbootstrap" class = "twitter-follow-button" data-width = "145px" data-link-color = "#0069D6" data-show-count = "false" > Follow @twbootstrap< / a > < script src = "http://platform.twitter.com/widgets.js" type = "text/javascript" > < / script >
2011-10-11 09:44:51 -07:00
< / li >
2011-10-26 23:11:56 -07:00
< li class = "tweet-btn" >
< a href = "https://twitter.com/share" class = "twitter-share-button" data-url = "http://twitter.github.com/bootstrap/" data-count = "horizontal" data-via = "twbootstrap" data-related = "mdo:Creator of Twitter Bootstrap" > Tweet< / a > < script type = "text/javascript" src = "http://platform.twitter.com/widgets.js" > < / script >
2011-10-11 09:44:51 -07:00
< / li >
< / ul >
2011-08-21 20:56:06 -07:00
2011-10-12 08:31:16 -07:00
2011-10-26 23:11:56 -07:00
<!-- About Bootstrap
================================================== -->
< section id = "about" >
< div class = "row" >
< div class = "span4" >
< h2 > Built for and by nerds< / h2 >
< p > Engineers at Twitter have historically used almost any library they were familiar with to meet front-end requirements. Bootstrap began as an answer to the challenges that presented. With the help of many awesome folks, Bootstrap has grown significantly.< / p >
< p > Read more on < a href = "https://dev.twitter.com/blog/bootstrap-twitter" > dev.twitter.com › < / a > < / p >
2011-10-12 08:31:16 -07:00
< / div >
2011-10-26 23:11:56 -07:00
< div class = "span4" >
< h2 > Cross-everything< / h2 >
< p > Bootstrap is tested and supported in major modern browsers like Chrome, Safari, Internet Explorer, and Firefox.< / p >
< img class = "browser-support" src = "assets/img/browsers.png" alt = "Tested and supported in Chrome, Safari, Internet Explorer, and Firefox" >
< ul >
< li > Latest Safari< / li >
< li > Latest Google Chrome< / li >
< li > Firefox 4+< / li >
< li > Internet Explorer 7+< / li >
< li > Opera 11< / li >
< / ul >
2011-10-12 08:31:16 -07:00
< / div >
2011-10-26 23:11:56 -07:00
< div class = "span4" >
< h2 > What's included< / h2 >
< p > Bootstrap comes complete with compiled CSS, uncompiled, and example templates.< / p >
< ul >
< li > < span class = "label" > New in 1.3< / span > < a href = "./javascript.html" > Javascript plugins< / a > < / li >
< li > All original .less files< / li >
< li > Fully < a href = "../bootstrap.css" > compiled< / a > and < a href = "../bootstrap.min.css" > minified< / a > CSS< / li >
< li > Complete styleguide documentation< / li >
< li > Three example pages with different layouts< / li >
< / ul >
2011-07-01 23:10:39 -07:00
< / div >
2011-10-26 23:11:56 -07:00
< / div > <!-- /row -->
< / section >
< h3 > Quick-start examples< / h3 >
< p > Need some quick templates? Check out these basic examples we've put together:< / p >
< ul class = "media-grid" >
< li >
< a href = "../examples/hero.html" > < img src = "assets/img/example-diagram-01.png" alt = "Simple three-column layout with hero unit" > < / a >
< / li >
< li >
< a href = "../examples/fluid.html" > < img src = "assets/img/example-diagram-02.png" alt = "Fluid layout with static sidebar" > < / a >
< / li >
< li >
< a href = "../examples/container-app.html" > < img src = "assets/img/example-diagram-03.png" alt = "Simple hanging container for apps" > < / a >
< / li >
< / ul >
2011-06-29 15:51:27 -07:00
2011-10-26 23:11:56 -07:00
< / div > <!-- /#overview -->
2011-06-29 15:51:27 -07:00
2011-04-27 23:00:33 -07:00
2011-10-26 23:11:56 -07:00
<!-- Footer
================================================== -->
2011-10-16 18:45:11 -07:00
< footer class = "footer" >
< p class = "pull-right" > < a href = "#" > Back to top< / a > < / p >
< p >
Designed and built with all the love in the world < a href = "http://twitter.com/twitter" target = "_blank" > @twitter< / a > by < a href = "http://twitter.com/mdo" target = "_blank" > @mdo< / a > and < a href = "http://twitter.com/fat" target = "_blank" > @fat< / a > .< br >
Code licensed under the < a href = "http://www.apache.org/licenses/LICENSE-2.0" target = "_blank" > Apache License v2.0< / a > . Documentation licensed under < a href = "http://creativecommons.org/licenses/by/3.0/" > CC BY 3.0< / a > .
< / p >
< / footer >
2011-10-16 03:00:58 -07:00
< / div > <!-- /container -->
2011-10-16 18:01:05 -07:00
<!-- Le javascript -->
2011-10-26 23:11:56 -07:00
<!-- Placed at the end of the document so the pages load faster -->
2011-10-16 18:01:05 -07:00
< script src = "http://code.jquery.com/jquery-1.5.2.min.js" > < / script >
< script src = "http://autobahn.tablesorter.com/jquery.tablesorter.min.js" > < / script >
< script src = "assets/js/google-code-prettify/prettify.js" > < / script >
< script > $ ( function ( ) { prettyPrint ( ) } ) < / script >
2011-10-19 23:12:50 -07:00
< script src = "../js/bootstrap-transitions.js" > < / script >
2011-10-16 18:01:05 -07:00
< script src = "../js/bootstrap-dropdown.js" > < / script >
< script src = "../js/bootstrap-twipsy.js" > < / script >
< script src = "../js/bootstrap-scrollspy.js" > < / script >
< script src = "assets/js/application.js" > < / script >
2011-04-27 13:53:51 -07:00
< / body >
2011-08-26 00:00:05 -07:00
< / html >
