bootstrap3 - CaffeineCat

テンプレ†

参考にさせていただきました。

http://qiita.com/zaburo/items/e5b8c51873b193bb1573

非レスポンシブ

nav/footer 有り
最下位 footer をつけたい場合

http://blog.webcreativepark.net/sample/js/36/footerFixed.js

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>SiteName</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="footerFixed.js"></script>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet" media="screen">
<style type="text/css">
html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}
#footer {
  background-color: #aaa;
  height: 50px;
  text-align: center;
  line-height: 50px;
  color: #fff;
  margin-top: 30px;
}
</style>
</head>

<body>
  <div class="container">

    <!-- navbar -->
    <div class="row">
      <nav class="navbar navbar-default navbar-fixed-top">
        <div class="navbar-header">
	  <a href="" class="navbar-brand">SiteName</a>
	</div>
	<ul class="nav navbar-nav">
	</ul>
      </nav>
    </div>

    <div class="row" style="padding: 80px 0 0 0">
      <div class="col-xs-4">left</div>
      <div class="col-xs-4">middle</div>
      <div class="col-xs-4">right</div>
    </div>

    <div class="row" style="padding: 80px 0 0 0">
      <div class="col-xs-4">left</div>
      <div class="col-xs-4">middle</div>
      <div class="col-xs-4">right</div>
    </div>

  </div>
  <!-- footer -->
  <div id="footer">&copy; 2017 ABC Corp inc.</div>
</body>

</html>

Linux Install

Android

Linux Tools

Linux AV

Linux Memo

WINDOWS

PROGRAM

動画 Memo

音楽 Memo

モバイルアプリ Memo

FILE FORMAT

PROTOCOL

DEVICE

BookMark

その他

テンプレ†