mirror of
https://github.com/twbs/bootstrap.git
synced 2024-12-03 15:24:19 +01:00
403 lines
18 KiB
HTML
403 lines
18 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<!-- Meta, title, CSS, favicons, etc. -->
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="description" content="Bootstrap, a sleek, intuitive, and powerful mobile first front-end framework for faster and easier web development.">
|
|
<meta name="keywords" content="HTML, CSS, JS, JavaScript, framework, bootstrap, front-end, frontend, web development">
|
|
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
|
|
|
<title>
|
|
|
|
About · Bootstrap
|
|
|
|
</title>
|
|
|
|
<!-- Bootstrap core CSS -->
|
|
|
|
<link href="../dist/css/bootstrap.min.css" rel="stylesheet">
|
|
|
|
|
|
|
|
<!-- Documentation extras -->
|
|
|
|
<link href="../assets/css/docs.min.css" rel="stylesheet">
|
|
|
|
<!--[if lt IE 9]><script src="../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
|
|
<script src="../assets/js/ie-emulation-modes-warning.js"></script>
|
|
|
|
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
|
|
<!--[if lt IE 9]>
|
|
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
|
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
|
<![endif]-->
|
|
|
|
<!-- Favicons -->
|
|
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
|
|
<link rel="icon" href="/favicon.ico">
|
|
|
|
<script>
|
|
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
|
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
|
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
|
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
|
|
ga('create', 'UA-146052-10', 'getbootstrap.com');
|
|
ga('send', 'pageview');
|
|
</script>
|
|
|
|
</head>
|
|
<body>
|
|
<a id="skippy" class="sr-only sr-only-focusable" href="#content"><div class="container"><span class="skiplink-text">Skip to main content</span></div></a>
|
|
|
|
<!-- Docs master nav -->
|
|
<header class="navbar navbar-static-top bs-docs-nav" id="top" role="banner">
|
|
<div class="container">
|
|
<div class="navbar-header">
|
|
<button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target="#bs-navbar" aria-controls="bs-navbar" aria-expanded="false">
|
|
<span class="sr-only">Toggle navigation</span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
<a href="../" class="navbar-brand">Bootstrap</a>
|
|
</div>
|
|
<nav id="bs-navbar" class="collapse navbar-collapse">
|
|
<ul class="nav navbar-nav">
|
|
<li>
|
|
<a href="../getting-started/">Getting started</a>
|
|
</li>
|
|
<li>
|
|
<a href="../css/">CSS</a>
|
|
</li>
|
|
<li>
|
|
<a href="../components/">Components</a>
|
|
</li>
|
|
<li>
|
|
<a href="../javascript/">JavaScript</a>
|
|
</li>
|
|
<li>
|
|
<a href="../customize/">Customize</a>
|
|
</li>
|
|
</ul>
|
|
<ul class="nav navbar-nav navbar-right">
|
|
<li><a href="http://expo.getbootstrap.com" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Expo');">Expo</a></li>
|
|
<li><a href="http://blog.getbootstrap.com" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Blog');">Blog</a></li>
|
|
</ul>
|
|
</nav>
|
|
</div>
|
|
</header>
|
|
|
|
|
|
<!-- Docs page layout -->
|
|
<div class="bs-docs-header" id="content" tabindex="-1">
|
|
<div class="container">
|
|
<h1>About</h1>
|
|
<p>Learn about the project's history, meet the maintaining teams, and find out how to use the Bootstrap brand.</p>
|
|
<div id="carbonads-container"><div class="carbonad"><div id="azcarbon"></div><script>var z = document.createElement("script"); z.async = true; z.src = "http://engine.carbonads.com/z/32341/azcarbon_2_1_0_HORIZ"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(z, s);</script></div></div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="container bs-docs-container">
|
|
|
|
<div class="row">
|
|
<div class="col-md-9" role="main">
|
|
<!-- History
|
|
================================================== -->
|
|
<div class="bs-docs-section">
|
|
<h1 id="history" class="page-header">History</h1>
|
|
|
|
<p class="lead">Originally created by a designer and a developer at Twitter, Bootstrap has become one of the most popular front-end frameworks and open source projects in the world.</p>
|
|
<p>Bootstrap was created at Twitter in mid-2010 by <a href="https://twitter.com/mdo">@mdo</a> and <a href="https://twitter.com/fat">@fat</a>. Prior to being an open-sourced framework, Bootstrap was known as <em>Twitter Blueprint</em>. A few months into development, Twitter held its <a href="https://blog.twitter.com/2010/hack-week">first Hack Week</a> and the project exploded as developers of all skill levels jumped in without any external guidance. It served as the style guide for internal tools development at the company for over a year before its public release, and continues to do so today.</p>
|
|
<p>Originally <a href="https://blog.twitter.com/2011/bootstrap-twitter">released</a> on <a href="https://twitter.com/mdo/statuses/104620039650557952"><time datetime="2011-08-19 11:25">Friday, August 19, 2011</time></a>, we've since had over <a href="https://github.com/twbs/bootstrap/releases">twenty releases</a>, including two major rewrites with v2 and v3. With Bootstrap 2, we added responsive functionality to the entire framework as an optional stylesheet. Building on that with Bootstrap 3, we rewrote the library once more to make it responsive by default with a mobile first approach.</p>
|
|
</div>
|
|
|
|
|
|
<!-- Team
|
|
================================================== -->
|
|
<div class="bs-docs-section">
|
|
<h1 id="team" class="page-header">Team</h1>
|
|
|
|
<p class="lead">Bootstrap is maintained by the founding team and a small group of invaluable core contributors, with the massive support and involvement of our community.</p>
|
|
|
|
<h2 id="team-core">Core team</h2>
|
|
<div class="list-group bs-team">
|
|
|
|
<div class="list-group-item">
|
|
<iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=mdo&type=follow"></iframe>
|
|
<a class="team-member" href="https://github.com/mdo">
|
|
<img src="https://secure.gravatar.com/avatar/bc4ab438f7a4ce1c406aadc688427f2c.jpg?s=32" alt="@mdo avatar" width="32" height="32">
|
|
<strong>Mark Otto</strong> <small>@mdo</small>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=fat&type=follow"></iframe>
|
|
<a class="team-member" href="https://github.com/fat">
|
|
<img src="https://secure.gravatar.com/avatar/a98244cbdacaf1c0b55499466002f7a8.jpg?s=32" alt="@fat avatar" width="32" height="32">
|
|
<strong>Jacob Thornton</strong> <small>@fat</small>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=cvrebert&type=follow"></iframe>
|
|
<a class="team-member" href="https://github.com/cvrebert">
|
|
<img src="https://secure.gravatar.com/avatar/edec428c425453955f770095a7d26c50.jpg?s=32" alt="@cvrebert avatar" width="32" height="32">
|
|
<strong>Chris Rebert</strong> <small>@cvrebert</small>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=juthilo&type=follow"></iframe>
|
|
<a class="team-member" href="https://github.com/juthilo">
|
|
<img src="https://secure.gravatar.com/avatar/0f7dd3ce58a416be5685ea6194f82b11.jpg?s=32" alt="@juthilo avatar" width="32" height="32">
|
|
<strong>Julian Thilo</strong> <small>@juthilo</small>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=xhmikosr&type=follow"></iframe>
|
|
<a class="team-member" href="https://github.com/xhmikosr">
|
|
<img src="https://secure.gravatar.com/avatar/e37759b1ea0125d4e97b1e00b5eed26f.jpg?s=32" alt="@xhmikosr avatar" width="32" height="32">
|
|
<strong>XhmikosR</strong> <small>@xhmikosr</small>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=hnrch02&type=follow"></iframe>
|
|
<a class="team-member" href="https://github.com/hnrch02">
|
|
<img src="https://secure.gravatar.com/avatar/0d53f5d3d3d28bd470f394d98f7ef48f.jpg?s=32" alt="@hnrch02 avatar" width="32" height="32">
|
|
<strong>Heinrich Fenkart</strong> <small>@hnrch02</small>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=patrickhlauke&type=follow"></iframe>
|
|
<a class="team-member" href="https://github.com/patrickhlauke">
|
|
<img src="https://secure.gravatar.com/avatar/357f279672db832fc41a5a2f36559fcb.jpg?s=32" alt="@patrickhlauke avatar" width="32" height="32">
|
|
<strong>Patrick H. Lauke</strong> <small>@patrickhlauke</small>
|
|
</a>
|
|
</div>
|
|
|
|
</div>
|
|
<p>Get involved with Bootstrap development by <a href="https://github.com/twbs/bootstrap/issues/new">opening an issue</a> or submitting a pull request. Read our <a href="https://github.com/twbs/bootstrap/blob/master/CONTRIBUTING.md">contributing guidelines</a> for information on how we develop.</p>
|
|
|
|
<h2 id="team-sass">Sass team</h2>
|
|
<div class="list-group bs-team">
|
|
|
|
<div class="list-group-item">
|
|
<iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=thomas-mcdonald&type=follow"></iframe>
|
|
<a class="team-member" href="https://github.com/thomas-mcdonald">
|
|
<img src="https://secure.gravatar.com/avatar/24cd55ab1a62ffb113ab8c02f64c9301.jpg?s=32" alt="@thomas-mcdonald avatar" width="32" height="32">
|
|
<strong>Thomas McDonald</strong> <small>@thomas-mcdonald</small>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=glebm&type=follow"></iframe>
|
|
<a class="team-member" href="https://github.com/glebm">
|
|
<img src="https://secure.gravatar.com/avatar/729f685b8e8d7e9feed18c177c82e59b.jpg?s=32" alt="@glebm avatar" width="32" height="32">
|
|
<strong>Gleb Mazovetskiy</strong> <small>@glebm</small>
|
|
</a>
|
|
</div>
|
|
|
|
</div>
|
|
<p>The <a href="https://github.com/twbs/bootstrap-sass">official Sass port of Bootstrap</a> was created and is maintained by this team. It became part of Bootstrap's organization with v3.1.0. Read the Sass <a href="https://github.com/twbs/bootstrap-sass/blob/master/CONTRIBUTING.md">contributing guidelines</a> for information on how the Sass port is developed.</p>
|
|
</div>
|
|
|
|
|
|
<!-- Brand
|
|
================================================== -->
|
|
<div class="bs-docs-section">
|
|
<h1 id="brand" class="page-header">Brand guidelines</h1>
|
|
|
|
<p class="lead">Have a need for Bootstrap's brand resources? Great! We have only a few guidelines we follow, and in turn ask you to follow as well. These guidelines were inspired by MailChimp's <a href="http://mailchimp.com/about/brand-assets/" target="_blank">Brand Assets</a>.</p>
|
|
|
|
<h2>Mark and logo</h2>
|
|
<p>Use either the Bootstrap mark (a capital <strong>B</strong>) or the standard logo (just <strong>Bootstrap</strong>). It should always appear in Helvetica Neue Bold. <strong>Do not use the Twitter bird</strong> in association with Bootstrap.</p>
|
|
<div class="bs-brand-logos">
|
|
<div class="bs-brand-item">
|
|
<div class="bs-docs-booticon bs-docs-booticon-lg">B</div>
|
|
</div>
|
|
<div class="bs-brand-item inverse">
|
|
<div class="bs-docs-booticon bs-docs-booticon-lg bs-docs-booticon-inverse">B</div>
|
|
</div>
|
|
</div>
|
|
<div class="bs-brand-logos">
|
|
<div class="bs-brand-item">
|
|
<h1>Bootstrap</h1>
|
|
</div>
|
|
<div class="bs-brand-item inverse">
|
|
<h1>Bootstrap</h1>
|
|
</div>
|
|
</div>
|
|
|
|
<h2>Download mark</h2>
|
|
<p>Download the Bootstrap mark in one of three styles, each available as an SVG file. Right click, Save as.</p>
|
|
<div class="bs-brand-logos">
|
|
<div class="bs-brand-item">
|
|
<img class="svg" src="../assets/brand/bootstrap-solid.svg" alt="Bootstrap" width="144" height="144">
|
|
</div>
|
|
<div class="bs-brand-item inverse">
|
|
<img class="svg" src="../assets/brand/bootstrap-outline.svg" alt="Bootstrap" width="144" height="144">
|
|
</div>
|
|
<div class="bs-brand-item inverse">
|
|
<img class="svg" src="../assets/brand/bootstrap-punchout.svg" alt="Bootstrap" width="144" height="144">
|
|
</div>
|
|
</div>
|
|
|
|
<h2>Name</h2>
|
|
<p>The project and framework should always be referred to as <strong>Bootstrap</strong>. No Twitter before it, no capital <em>s</em>, and no abbreviations except for one, a capital <strong>B</strong>.</p>
|
|
<div class="bs-brand-logos">
|
|
<div class="bs-brand-item">
|
|
<h3>Bootstrap</h3>
|
|
<span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
|
|
<span class="sr-only">(correct)</span>
|
|
</div>
|
|
<div class="bs-brand-item">
|
|
<h3 class="text-muted">BootStrap</h3>
|
|
<span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
|
|
<span class="sr-only">(incorrect)</span>
|
|
</div>
|
|
<div class="bs-brand-item">
|
|
<h3 class="text-muted">Twitter Bootstrap</h3>
|
|
<span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
|
|
<span class="sr-only">(incorrect)</span>
|
|
</div>
|
|
</div>
|
|
|
|
<h2>Colors</h2>
|
|
<p>Our docs and branding use a handful of primary colors to differentiate what <em>is</em> Bootstrap from what <em>is in</em> Bootstrap. In other words, if it's purple, it's representative of Bootstrap.</p>
|
|
<div class="bs-brand">
|
|
<div class="color-swatches">
|
|
<div class="color-swatch bs-purple"></div>
|
|
<div class="color-swatch bs-purple-light"></div>
|
|
<div class="color-swatch bs-purple-lighter"></div>
|
|
<div class="color-swatch bs-gray"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="col-md-3" role="complementary">
|
|
<nav class="bs-docs-sidebar hidden-print hidden-xs hidden-sm">
|
|
<ul class="nav bs-docs-sidenav">
|
|
|
|
<li>
|
|
<a href="#history">History</a>
|
|
</li>
|
|
<li>
|
|
<a href="#team">Team</a>
|
|
</li>
|
|
<li>
|
|
<a href="#brand">Brand guidelines</a>
|
|
</li>
|
|
|
|
|
|
</ul>
|
|
<a class="back-to-top" href="#top">
|
|
Back to top
|
|
</a>
|
|
|
|
</nav>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Footer
|
|
================================================== -->
|
|
<footer class="bs-docs-footer" role="contentinfo">
|
|
<div class="container">
|
|
<div class="bs-docs-social">
|
|
<ul class="bs-docs-social-buttons">
|
|
<li>
|
|
<iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=twbs&repo=bootstrap&type=watch&count=true" width="100" height="20" title="Star on GitHub"></iframe>
|
|
</li>
|
|
<li>
|
|
<iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=twbs&repo=bootstrap&type=fork&count=true" width="102" height="20" title="Fork on GitHub"></iframe>
|
|
</li>
|
|
<li class="follow-btn">
|
|
<a href="https://twitter.com/getbootstrap" class="twitter-follow-button" data-link-color="#0069D6" data-show-count="true">Follow @getbootstrap</a>
|
|
</li>
|
|
<li class="tweet-btn">
|
|
<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://getbootstrap.com/" data-count="horizontal" data-via="getbootstrap" data-related="mdo:Creator of Bootstrap">Tweet</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
|
|
<p>Designed and built with all the love in the world by <a href="https://twitter.com/mdo" target="_blank">@mdo</a> and <a href="https://twitter.com/fat" target="_blank">@fat</a>.</p>
|
|
<p>Maintained by the <a href="https://github.com/orgs/twbs/people">core team</a> with the help of <a href="https://github.com/twbs/bootstrap/graphs/contributors">our contributors</a>.</p>
|
|
<p>Code licensed under <a rel="license" href="https://github.com/twbs/bootstrap/blob/master/LICENSE" target="_blank">MIT</a>, documentation under <a rel="license" href="https://creativecommons.org/licenses/by/3.0/" target="_blank">CC BY 3.0</a>.</p>
|
|
<ul class="bs-docs-footer-links text-muted">
|
|
<li>Currently v3.3.5</li>
|
|
<li>·</li>
|
|
<li><a href="https://github.com/twbs/bootstrap">GitHub</a></li>
|
|
<li>·</li>
|
|
<li><a href="../getting-started/#examples">Examples</a></li>
|
|
<li>·</li>
|
|
<li><a href="../2.3.2/">v2.3.2 docs</a></li>
|
|
<li>·</li>
|
|
<li><a href="../about/">About</a></li>
|
|
<li>·</li>
|
|
<li><a href="http://expo.getbootstrap.com">Expo</a></li>
|
|
<li>·</li>
|
|
<li><a href="http://blog.getbootstrap.com">Blog</a></li>
|
|
<li>·</li>
|
|
<li><a href="https://github.com/twbs/bootstrap/issues">Issues</a></li>
|
|
<li>·</li>
|
|
<li><a href="https://github.com/twbs/bootstrap/releases">Releases</a></li>
|
|
</ul>
|
|
</div>
|
|
</footer>
|
|
|
|
<!-- Bootstrap core JavaScript
|
|
================================================== -->
|
|
<!-- Placed at the end of the document so the pages load faster -->
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
|
|
|
|
|
|
<script src="../dist/js/bootstrap.min.js"></script>
|
|
|
|
|
|
|
|
<script src="../assets/js/docs.min.js"></script>
|
|
|
|
|
|
|
|
|
|
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
|
|
<script src="../assets/js/ie10-viewport-bug-workaround.js"></script>
|
|
|
|
|
|
<script>
|
|
window.twttr = (function (d,s,id) {
|
|
var t, js, fjs = d.getElementsByTagName(s)[0];
|
|
if (d.getElementById(id)) return; js=d.createElement(s); js.id=id; js.async=1;
|
|
js.src="https://platform.twitter.com/widgets.js"; fjs.parentNode.insertBefore(js, fjs);
|
|
return window.twttr || (t = { _e: [], ready: function(f){ t._e.push(f) } });
|
|
}(document, "script", "twitter-wjs"));
|
|
</script>
|
|
|
|
<!-- Analytics
|
|
================================================== -->
|
|
<script>
|
|
var _gauges = _gauges || [];
|
|
(function() {
|
|
var t = document.createElement('script');
|
|
t.async = true;
|
|
t.id = 'gauges-tracker';
|
|
t.setAttribute('data-site-id', '4f0dc9fef5a1f55508000013');
|
|
t.src = '//secure.gaug.es/track.js';
|
|
var s = document.getElementsByTagName('script')[0];
|
|
s.parentNode.insertBefore(t, s);
|
|
})();
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|