0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-14 02:24:00 +01:00
Bootstrap/docs/3.4/index.html
2018-12-13 15:57:10 -08:00

250 lines
11 KiB
HTML
Executable File

<!doctype html>
<html lang="en">
<head>
<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="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
<title>
Bootstrap &middot; The world's most popular mobile-first and responsive front-end framework.
</title>
<!-- Bootstrap core CSS -->
<link href="/docs/3.4/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Documentation extras -->
<link href="/docs/3.4/assets/css/docs.min.css" rel="stylesheet">
<!--[if lt IE 9]><script src="/docs/3.4/assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
<!-- 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.3/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="/docs/3.4/apple-touch-icon.png">
<link rel="icon" href="/docs/3.4/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','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-146052-10', 'getbootstrap.com');
ga('send', 'pageview');
</script>
</head>
<body class="bs-docs-home">
<a id="skippy" class="sr-only sr-only-focusable text-center" href="#content">
<div class="container">
<span class="skiplink-text">Skip to main content</span>
</div>
</a>
<a href="https://getbootstrap.com/" class="v4-tease">Looking for Bootstrap 4?</a>
<header class="navbar navbar-static-top bs-docs-nav" id="top">
<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="/docs/3.4/" class="navbar-brand">Bootstrap</a>
</div>
<nav id="bs-navbar" class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li>
<a href="/docs/3.4/getting-started/">Getting started</a>
</li>
<li>
<a href="/docs/3.4/css/">CSS</a>
</li>
<li>
<a href="/docs/3.4/components/">Components</a>
</li>
<li>
<a href="/docs/3.4/javascript/">JavaScript</a>
</li>
<li>
<a href="/docs/3.4/customize/">Customize</a>
</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
v3.4.0 <span class="caret"></span>
</a>
<ul class="dropdown-menu">
<li><a href="https://getbootstrap.com/">Latest (4.x)</a></li>
<li><a href="https://v4-alpha.getbootstrap.com/">v4 Alpha 6</a></li>
<li class="divider"></li>
<li class="active"><a href="https://getbootstrap.com/docs/3.4.0/">v3.4.0</a></li>
<li><a href="https://getbootstrap.com/docs/3.3/">v3.3.7</a></li>
<li><a href="https://getbootstrap.com/2.3.2/">v2.3.2</a></li>
</ul>
</li>
<li><a href="https://themes.getbootstrap.com" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Themes')">Themes</a></li>
<li><a href="https://expo.getbootstrap.com" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Expo');">Expo</a></li>
<li><a href="https://blog.getbootstrap.com" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Blog');">Blog</a></li>
</ul>
</nav>
</div>
</header>
<main class="bs-docs-masthead" id="content" tabindex="-1">
<div class="container">
<span class="bs-docs-booticon bs-docs-booticon-lg bs-docs-booticon-outline">B</span>
<p class="lead">Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web.</p>
<p class="lead">
<a href="/docs/3.4/getting-started/#download" class="btn btn-outline-inverse btn-lg" onclick="ga('send', 'event', 'Jumbotron actions', 'Download', 'Download 3.4.0');">Download Bootstrap</a>
</p>
<p class="version">Currently v3.4.0</p>
<script async src="https://cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=getbootstrapcom" id="_carbonads_js"></script>
</div>
</main>
<div class="bs-docs-featurette">
<div class="container">
<h2 class="bs-docs-featurette-title">Designed for everyone, everywhere</h2>
<p class="lead">Bootstrap makes front-end web development faster and easier. It's made for folks of all skill levels, devices of all shapes, and projects of all sizes.</p>
<hr class="half-rule">
<div class="row">
<div class="col-sm-4">
<img src="/docs/3.4/assets/img/sass-less.png" alt="Sass and Less support" class="img-responsive" width="1000" height="360">
<h3>Preprocessors</h3>
<p>Bootstrap ships with vanilla CSS, but its source code utilizes the two most popular CSS preprocessors, <a href="/docs/3.4/css/#less">Less</a> and <a href="/docs/3.4/css/#sass">Sass</a>. Quickly get started with precompiled CSS or build on the source.</p>
</div>
<div class="col-sm-4">
<img src="/docs/3.4/assets/img/devices.png" alt="Responsive across devices" class="img-responsive" width="1000" height="360">
<h3>One framework, every device.</h3>
<p>Bootstrap easily and efficiently scales your websites and applications with a single code base, from phones to tablets to desktops with CSS media queries.</p>
</div>
<div class="col-sm-4">
<img src="/docs/3.4/assets/img/components.png" alt="Components" class="img-responsive" width="1000" height="360">
<h3>Full of features</h3>
<p>With Bootstrap, you get extensive and beautiful documentation for common HTML elements, dozens of custom HTML and CSS components, and awesome jQuery plugins.</p>
</div>
</div>
<hr class="half-rule">
<p class="lead">Bootstrap is open source. It's hosted, developed, and maintained on GitHub.</p>
<a href="https://github.com/twbs/bootstrap" class="btn btn-outline btn-lg">View the GitHub project</a>
</div>
</div>
<div class="bs-docs-featurette">
<div class="container">
<h2 class="bs-docs-featurette-title">Official Bootstrap Themes</h2>
<p class="lead">
Take Bootstrap to the next level with official premium themes. Each theme is its own toolkit featuring all of Bootstrap, brand new components and plugins, full docs, build tools, and more.
</p>
<p class="lead">
<a href="https://themes.getbootstrap.com" class="btn btn-outline btn-lg">Browse themes</a>
</p>
<img class="img-responsive" src="/docs/3.4/assets/img/bs-themes.png" alt="Bootstrap Themes" width="1024" height="388">
</div>
</div>
<div class="bs-docs-featurette">
<div class="container">
<h2 class="bs-docs-featurette-title">Built with Bootstrap</h2>
<p class="lead">Millions of amazing sites across the web are being built with Bootstrap. Get started on your own with our growing <a href="/docs/3.4/getting-started/#examples">collection of examples</a> or by exploring some of our favorites.</p>
<hr class="half-rule">
<div class="row bs-docs-featured-sites">
<div class="col-xs-8 col-xs-offset-2 col-sm-4 col-sm-offset-0">
<a href="https://expo.getbootstrap.com/2014/10/29/lyft/" rel="noopener" target="_blank" title="Lyft">
<img src="/docs/3.4/assets/img/expo-lyft.jpg" alt="Lyft" class="img-responsive" width="800" height="600">
</a>
</div>
<div class="col-xs-8 col-xs-offset-2 col-sm-4 col-sm-offset-0">
<a href="https://expo.getbootstrap.com/2014/09/30/vogue/" rel="noopener" target="_blank" title="Vogue">
<img src="/docs/3.4/assets/img/expo-vogue.jpg" alt="Vogue" class="img-responsive" width="800" height="600">
</a>
</div>
<div class="col-xs-8 col-xs-offset-2 col-sm-4 col-sm-offset-0">
<a href="https://expo.getbootstrap.com/2014/02/12/newsweek/" rel="noopener" target="_blank" title="Newsweek">
<img src="/docs/3.4/assets/img/expo-newsweek.jpg" alt="Newsweek" class="img-responsive" width="800" height="600">
</a>
</div>
</div>
<hr class="half-rule">
<p class="lead">We showcase dozens of inspiring projects built with Bootstrap on the Bootstrap Expo.</p>
<a href="https://expo.getbootstrap.com" class="btn btn-outline btn-lg">Explore the Expo</a>
</div>
</div>
<!-- Footer
================================================== -->
<footer class="bs-docs-footer">
<div class="container">
<ul class="bs-docs-footer-links">
<li><a href="https://github.com/twbs/bootstrap">GitHub</a></li>
<li><a href="https://twitter.com/getbootstrap">Twitter</a></li>
<li><a href="/docs/3.4/getting-started/#examples">Examples</a></li>
<li><a href="/docs/3.4/about/">About</a></li>
</ul>
<p>Designed and built with all the love in the world by <a href="https://twitter.com/mdo" rel="noopener" target="_blank">@mdo</a> and <a href="https://twitter.com/fat" rel="noopener" target="_blank">@fat</a>. 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 <a href="https://github.com/twbs/bootstrap/blob/master/LICENSE" rel="license noopener" target="_blank">MIT</a>, docs <a href="https://creativecommons.org/licenses/by/3.0/" rel="license noopener" target="_blank">CC BY 3.0</a>.</p>
</div>
</footer>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ" crossorigin="anonymous"></script>
<script>window.jQuery || document.write('<script src="/docs/3.4/assets/js/vendor/jquery.min.js"><\/script>')</script>
<script src="/docs/3.4/dist/js/bootstrap.min.js"></script>
<script src="/docs/3.4/assets/js/docs.min.js"></script>
</body>
</html>