Skip to content
GitLab
Switch branch/tag
Find file BlameHistoryPermalink
upgrading.html 14.79 KiB
1 
<!DOCTYPE html>
2 
<html lang="en">
3 
  <head>
4 
    <meta charset="utf-8">
5 
    <title>Upgrading · Twitter Bootstrap</title>
6 
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
7 
    <meta name="description" content="">
8 
    <meta name="author" content="">
9
10 
    <!-- Le styles -->
11 
    <link href="assets/css/bootstrap.css" rel="stylesheet">
12 
    <link href="assets/css/bootstrap-responsive.css" rel="stylesheet">
13 
    <link href="assets/css/docs.css" rel="stylesheet">
14 
    <link href="assets/js/google-code-prettify/prettify.css" rel="stylesheet">
15
16 
    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
17 
    <!--[if lt IE 9]>
18 
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
19 
    <![endif]-->
20
21 
    <!-- Le fav and touch icons -->
22 
    <link rel="shortcut icon" href="assets/ico/favicon.ico">
23 
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="assets/ico/apple-touch-icon-144-precomposed.png">
24 
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png">
25 
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png">
26 
    <link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png">
27
28 
  </head>
29
30 
  <body data-spy="scroll" data-target=".bs-docs-sidebar" data-offset="10">
31
32 
    <!-- Navbar
33 
    ================================================== -->
34 
    <div class="navbar navbar-fixed-top">
35 
      <div class="navbar-inner">
36 
        <div class="container">
37 
          <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
38 
            <span class="icon-bar"></span>
39 
            <span class="icon-bar"></span>
40 
            <span class="icon-bar"></span>
41 
          </button>
42 
          <a class="brand" href="./index.html">Bootstrap</a>
43 
          <div class="nav-collapse collapse">
44 
            <ul class="nav">
45 
              <li class="">
46 
                <a href="./index.html">Home</a>
47 
              </li>
48 
              <li class="">
49 
                <a href="./getting-started.html">Get started</a>
50 
              </li>
51 
              <li class="">
52 
                <a href="./scaffolding.html">Scaffolding</a>
53 
              </li>
54 
              <li class="">
55 
                <a href="./base-css.html">Base CSS</a>
56 
              </li>
57 
              <li class="">
58 
                <a href="./components.html">Components</a>
59 
              </li>
60 
              <li class="">
61 
                <a href="./javascript.html">Javascript</a>
62 
              </li>
63 
              <li class="">
64 
                <a href="./extend.html">Extend</a>
65 
              </li>
66 
            </ul>
67 
          </div>
68 
        </div>
69 
      </div>
70 
    </div>
7172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140
<!-- Masthead ================================================== --> <header class="jumbotron subhead" id="overview"> <h1>Upgrading to Bootstrap 2</h1> <p class="lead">Learn about significant changes and additions since v1.4 with this handy guide.</p> </header> <!-- Project ================================================== --> <section id="docs"> <div class="page-header"> <h1>Project changes</h1> </div> <ul> <li>Docs: major updates across the board to general structure, examples, and code snippets. Also made responsive with new media queries.</li> <li>Docs: all docs pages are now powered by Mustache templates and strings are wrapped in i18n tags for translation by the Twitter Translation Center. All changes to documentation must be done here and then compiled (similar to our CSS and LESS).</li> <li>Repo directory structure: removed the compiled CSS from the root in favor of a large direct download link on the docs homepage. Compiled CSS is in <code>/docs/assets/css/</code>.</li> <li>Docs and repo: one makefile, just type <code>make</code> in the Terminal and get updated docs and CSS.</li> </ul> </section> <!-- Scaffolding ================================================== --> <section id="scaffolding"> <div class="page-header"> <h1>Scaffolding</h1> </div> <h3>Grid system</h3> <ul> <li>Updated grid system, now only 12 columns instead of 16 <li>Responsive approach means your projects virtually work out of the box on smartphones, tablets, and more</li> <li>Removed unused (by default) grid columns support for 17-24 columns</li> </ul> <h3>Responsive (media queries)</h3> <ul> <li>Media queries added for <strong>basic support</strong> across mobile and tablet devices <li>Responsive CSS is compiled separately, as bootstrap-responsive.css</li> </ul> </section> <!-- Base CSS ================================================== --> <section id="baseCSS"> <div class="page-header"> <h1>Base CSS</h1> </div> <h3>Typography</h3> <ul> <li><code>h4</code> elements were dropped from 16px to 14px with a default <code>line-height</code> of 18px</li> <li><code>h5</code> elements were dropped from 14px to 12px</li> <li><code>h6</code> elements were dropped from 13px to 11px</li> <li>Right-aligned option for blockquotes if <code>float: right;</code></li> </ul> <h3>Code</h3> <ul> <li>New graphical style for <code>&lt;code&gt;</code></li> <li>Google Code Prettify styles updated (based on GitHub's gists)</li> </ul> <h3>Tables</h3> <ul> <li>Improved support for <code>colspan</code> and <code>rowspan</code></li> <li>Styles now restricted to new base class, <code>.table</code></li> <li>Table classes standardized with <code>.table-</code> required as a prefix</li>