BloggerでTwitter Bootstrap CSSを使ってみる

BloggerでTwitter Bootstrap CSSを使ってみる．

Twitter BootStrap CSSというのは，twitterのようなデザインのCSSのこと．
これを利用する事で，カッコいいデザインのサイトを簡単に作れるようになる．

使い方は簡単．
公式サイトからファイルをダウンロードして，CSSとして読み込むだけ．
例えば，この上のボタンはこんな感じにして，classにボタンの種類を設定している．

 
//ボタンが押されたらCSSをheadに突き刺す
<script type="text/javascript">
<!--

function loadCSS(){
    var bscss = document.createElement("link");
    bscss.rel="stylesheet";
    bscss.href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css";
    bscss.type="text/css";
    document.getElementsByTagName('head')[0].appendChild(bscss);
}

// -->
</script>

//ボタンを実装
<form>
<input class="btn btn-primary" onclick="loadCSS()" type="button" value="  Change CSS !!  " />
</form>

ボタンパーツ以外にも色々とPHPでゴニョゴニョするようなものが，
簡単に実現出来る優れものです．

ちなみにprogress bar プログレスバーはこんな感じ．