端的にまとめ
boostrap3はtwitter社が作り出したらオープンソース用のライブラリみたいです。
こちらの使い方を準じ記載
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>bootstrap3ノ進め方</title> <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"> <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css"> <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script> <![endif]--> <script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script> <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script> </head> <body> <div class="row"> <div class="col-md-1">1</div> <div class="col-md-1">2</div> <div class="col-md-1">3</div> <div class="col-md-1">4</div> <div class="col-md-1">5</div> <div class="col-md-1">6</div> <div class="col-md-1">7</div> <div class="col-md-1">8</div> <div class="col-md-1">9</div> <div class="col-md-1">10</div> <div class="col-md-1">11</div> <div class="col-md-1">12</div> </div> </body> </html>
グリッドを提供するためのソースです１行１２列構成となっているみたいです。
レシポンシブデザインが有効で逆に画像を利用する系はwidthとheightの関係があるので
注意をした方が良さそうです。
CDNを利用した方がテンプレート化しやすいのでお勧めです。
とりあえず初回は利用方法まで
