CSS学習用Djangoプロジェクト

HTML、CSS、JavaScript、Bootstrapを使った実践的な画面開発のドキュメント版です。 静的ファイルとして独立して動作し、どこでも学習できます。

学習コンテンツ

CSSサンプル

Grid、Flexbox、アニメーションの実装例

見る

Bootstrap例

コンポーネント、グリッド、ユーティリティ

見る

JavaScript例

DOM操作、イベント処理、インタラクション

見る

レイアウト例

Hero、Grid、価格表などのパターン

見る

使い方

このドキュメントの活用方法
  1. サイドバーからコンテンツを選択
    学習したいトピックをクリック
  2. 実装例を確認
    まず動作を見て理解
  3. コードを読み解く
    HTML/CSS/JSのコード例を分析
  4. 自分で試してみる
    コードをコピーして改変・実験

Tip: ブラウザの開発者ツール(F12)を使って、 リアルタイムでスタイルを変更しながら学習すると効果的です!