bootstrap

＜手順＞
①読み込む

<script src="//code.jquery.com/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>

②クラス適用

以上！ホントに簡単。ありがたい。

---

★「フォーム」での使用例

<form method="POST" class="panel panel-default panel-body">
  <div class="form-group <?php if ($err['○○'] != '') echo 'has-error'; ?>">
    <input class="form-control" type="text" name="○○" value="<?php echo h($○○); ?>" /><span class="help-block"><?php echo h($err['○○']); ?></span>
  </div>

  <div class="form-group">
    <input class="btn btn-success btn-block" type="submit" value="変更">
  </div>
</form>

使用クラス
▪formタグ
　class="panel panel-default panel-body"

▪divタグ
　class="form-group"

▪inputタグ
　・フィールド→class="form-control"
　・ボタン　　→class="btn btn-success btn-block"

▪spanタグ
　class="help-block"

---

★「リスト」での使用例

<ul class="list-group">
  <?php foreach ($items as $item): ?>
  　<li class="list-group-item">
    　<?php echo h($item['○○']); ?>
  　</li>
  <?php endforeach; ?>

使用クラス
▪ulタグ
　class="list-group"
▪liタグ
　class="list-group-item"