Bootstrap starter template
ちょっとしたツールを作る度に Bootstrap 読み込むコードを書いてた.
毎回毎回書くのは面倒なのでテンプレート化して貼っておく.
よかったら使ってくださいな♪
自分用のテンプレなのでタイトルとかリンクとかは修正してね.
Template code
DEMO
読み込んでる bootstrap や jquery は CDN のものを使っているので
何かダウンロードとかする必要はないです.
下記のコードをコピって index.html とかで保存すれば
サクッと Bootstrap を使ったページを作り始めることができます!!
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, user-scalable=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<title>tm tool</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.1/css/bootstrap.min.css">
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.1/js/bootstrap.min.js"></script>
<style>
body {
padding-top: 50px;
}
</style>
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">tm tool</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#github">Github</a></li>
<li><a href="http://tmlife.net">Blog</a></li>
<li><a href="https://twitter.com/phi_jp">Contact</a></li>
</ul>
</div>
</div>
</div>
<div class="container">
<div>
<h1>
tm tool starter template
</h1>
<p>
tm tool starter template with bootstrap.
</p>
</div>
</div>
</body>
</html>