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 標簽中的演示,可以點擊"嚐試一下"查看在線實例:

按鈕

嚐試一下 »


表格:

嚐試一下 »


圖片彈窗:

嚐試一下 »


警告:

嚐試一下 »



網格:

嚐試一下 »


進度條:

嚐試一下 »


麵板:

嚐試一下 »


下拉菜單:

嚐試一下 »


手風琴效果:

嚐試一下 »


頂部導航:

嚐試一下 »


模態框:

嚐試一下 »


開關:

嚐試一下 »


滑塊:

嚐試一下 »