0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-04 16:24:22 +01:00
Bootstrap/migration/index.html

2 lines
18 KiB
HTML
Raw Normal View History

2015-11-24 20:42:45 +01:00
<!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=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> Migrating to v3.x &middot; Bootstrap </title> <link href=../dist/css/bootstrap.min.css rel=stylesheet> <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><!--[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]--><link rel=apple-touch-icon href=/apple-touch-icon.png> <link rel=icon href=/favicon.ico> <script>!function(e,t,a,n,c,o,s){e.GoogleAnalyticsObject=c,e[c]=e[c]||function(){(e[c].q=e[c].q||[]).push(arguments)},e[c].l=1*new Date,o=t.createElement(a),s=t.getElementsByTagName(a)[0],o.async=1,o.src=n,s.parentNode.insertBefore(o,s)}(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> <a href="http://blog.getbootstrap.com/2015/08/19/bootstrap-4-alpha/" class="v4-tease">Aww yeah, Bootstrap 4 is coming!</a> <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://themes.getbootstrap.com onclick="ga(&quot;send&quot;,&quot;event&quot;,&quot;Navbar&quot;,&quot;Community links&quot;,&quot;Themes&quot;)">Themes</a></li> <li><a href=http://expo.getbootstrap.com onclick="ga(&quot;send&quot;,&quot;event&quot;,&quot;Navbar&quot;,&quot;Community links&quot;,&quot;Expo&quot;)">Expo</a></li> <li><a href=http://blog.getbootstrap.com onclick="ga(&quot;send&quot;,&quot;event&quot;,&quot;Navbar&quot;,&quot;Community links&quot;,&quot;Blog&quot;)">Blog</a></li> </ul> </nav> </div> </header> <div class=bs-docs-header id=content tabindex=-1> <div class=container> <h1>Migrating to v3.x</h1> <p>Guidance on how to upgrade from Bootstrap v2.x to v3.x with emphasis on major changes, what's new, and what's been removed.</p> <script async type="text/javascript" src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=getbootstrapcom" id="_carbonads_js"></script></div></div><div class="container bs-docs-container"> <div class=row> <div class=col-md-9 role=main> <div class=bs-docs-section> <h1 class=page-header>Migrating from 2.x to 3.0</h1> <p class=lead>Bootstrap 3 is not backwards compatible with v2.x. Use this section as a general guide to upgrading from v2.x to v3.0. For a broader overview, see <a href="http://blog.getbootstrap.com/2013/08/19/bootstrap-3-released/">what's new</a> in the v3.0 release announcement.</p> <h2 id=classes>Major class changes</h2> <p>This table shows the style changes between v2.x and v3.0.</p> <div class=table-responsive> <table class="table table-bordered table-striped"> <thead> <tr> <th>Bootstrap 2.x</th> <th>Bootstrap 3.0</th> </tr> </thead> <tbody> <tr> <td><code>.row-fluid</code></td> <td><code>.row</code></td> </tr> <tr> <td><code>.span*</code></td> <td><code>.col-md-*</code></td> </tr> <tr> <td><code>.offset*</code></td> <td><code>.col-md-offset-*</code></td> </tr> <tr> <td><code>.brand</code></td> <td><code>.navbar-brand</code></td> </tr> <tr> <td><code>.navbar .nav</code></td> <td><code>.navbar-nav</code></td> </tr> <tr> <td><code>.nav-collapse</code></td> <td><code>.navbar-collapse</code></td> </tr> <tr> <td><code>.nav-toggle</code></td> <td><code>.navbar-toggle</code></td> </tr> <tr> <td><code>.btn-navbar</code></td> <td><code>.navbar-btn</code></td> </tr> <tr> <td><code>.hero-unit</code></td> <td><code>.jumbotron</code></td> </tr> <tr> <td><code>.icon-*</code></td> <td><code>.gl