Foundation5 チュートリアル
Foundation はレスポンシブな HTML, CSS and JavaScript フレームワークを開発するためのものです。
Foundation は、あらゆるデバイス上で Web アプリを構築するための、使いやすく、強力で柔軟なフレームワークです。
Foundation はモバイルファーストのポピュラーなフレームワークです。
オンラインサンプル
サンプル には何百もの Foundation サンプルが含まれています。
当社のオンラインエディタを直接使用して、「送信して実行」ボタンをクリックすると結果を表示できます:
Foundation サンプル
<div class="row">
<div class="medium-12 columns">
<div class="panel">
<h1>Foundation ページ</h1>
<p>ウィンドウサイズをリセットして、効果を確認してください!</p>
<button type="button" class="button small">私はボタンです!</button>
</div>
</div>
</div>
<div class="row">
<div class="medium-4 columns">
<h3>サンプル</h3>
<p>学ぶのは技術だけではなく、夢でもあります!!!</p>
</div>
<div class="medium-4 columns">
<h3>サンプル</h3>
<p>学ぶのは技術だけではなく、夢でもあります!!!</p>
</div>
<div class="medium-4 columns">
<h3>サンプル</h3>
<p>学ぶのは技術だけではなく、夢でもあります!!!</p>
</div>
</div>
試してみる »
「試してみる」ボタンをクリックして、オンラインサンプルを表示します。
Foundation の特徴
以下の効果は iframe タグ内でのデモです。「試してみる」をクリックするとオンラインサンプルを表示できます:
ボタン
テーブル:
画像ポップアップ:
警告:
グリッド:
プログレスバー:
パネル:
ドロップダウンメニュー:
アコーディオン効果:
トップナビゲーション:
モーダル:
スイッチ:
スライダー:
その他の拡張