Bootstrap CSS – Quickly Style Your HTML5 Page – Skeleton

Bootstrap (from Twitter), is a Free CSS framework. Bootstrap has table-free layouts, navbars, buttons, icons and automatic scaling for mobile devices.
Copy bootstrap.css and bootstrap-responsive.css to your website, link the stylesheets and you’re ready to go.

<!doctype html>
<html>
    <head>
        <title>Bootstrap HTML5 Skeleton</title>
        <meta charset="utf-8" />
    </head>
    <body>
        <div class="container">
            <hr />
            <h1>Bootstrap HTML5 Skeleton</h1>
            <p>Hello Bootstrap CSS World!
            <a href="http://TeroKarvinen.com">Tero Karvinen</a>. </p>
        </div>
        <link rel="stylesheet" href="css/bootstrap.min.css" />
        <link rel="stylesheet" href="css/bootstrap-responsive.min.css" />
    </body>
</html>

You can also check a whole page Bootstrap HTML5 skeleton.

See also

Bootsrap documentation.
Bootstrap source code on GitHub

<!doctype html>
<html>
    <head>
        <title>
            Bootstrap HTML5 Skeleton
        </title>
        <meta charset="utf-8" />
    </head>
    <body>
        <div class="container">
            <hr />
            <h1>
                Bootstrap HTML5 Skeleton
                <small>
                    Quick styles, no tables for layout.
                </small>
            </h1>
            <p>
                Hello Bootstrap CSS World! Bootstrap HTML5 skeleton by
                <a href="http://TeroKarvinen.com">
                    Tero Karvinen.
                </a>
                Feel free to use as an example to get started.
            </p>
            <p>
                Copy
                <a href="static/bootstrap/css/bootstrap.css">
                    bootstrap.css
                </a>
                and
                <a href="static/bootstrap/css/bootstrap-responsive.css">
                    bootstrap-responsive.css
                </a>
                to your website, link the stylesheets and you're ready to go.
            </p>
            <p>
                Just view the source of this web page to get started.
            </p>
            <p>
                Bootsrap has great
                <a href="http://twitter.github.com/bootstrap/scaffolding.html">
                    documentation.
                </a>
                You can do layouts with CSS (no tables), create buttons, have icons, automatically support mobile devices...
            </p>
            <hr />
            <p>
                <a href="http://terokarvinen.com">
                    TeroKarvinen.com
                </a>
                -
                <a href="http://twitter.github.com/bootstrap/">
                    Bootstrap
                </a>
                -
                <a href="http://validator.w3.org/check?uri=referer">
                    Validate HTML5
                </a>
            </p>
        </div>
        <link rel="stylesheet" href="static/bootstrap/css/bootstrap.css" />
        <link rel="stylesheet" href="static/bootstrap/css/bootstrap-responsive.css" />
    </body>
</html>
Posted in Uncategorized | Tagged , , , , , | 1 Comment

One Response to Bootstrap CSS – Quickly Style Your HTML5 Page – Skeleton

  1. JL says:

    Just wanted to comment that the recommended way to include CSS is at the top of the html in the head rather than at the bottom. This will allow the browser to progressively render the content rather than wait until the end.
    See: http://developer.yahoo.com/performance/rules.html#css_top