Foundation 基礎(chǔ)
Foundation 教程
Foundation 安裝
Foundation 按鈕
Foundation 按鈕組
Foundation 標(biāo)簽
Foundation 表單
Foundation 表格
Foundation 側(cè)邊欄
Foundation 頂部導(dǎo)航欄
Foundation 分頁
Foundation 滑動導(dǎo)航
Foundation 滑塊
Foundation 價格表
Foundation 進(jìn)度條
Foundation 均衡器(Equalizer)
Foundation 開關(guān)
Foundation 列表
Foundation 麥哲倫（Magellan）導(dǎo)航
Foundation Joyride
Foundation 面板
Foundation 模態(tài)框
Foundation 輸入框 尺寸
Foundation 提示框
Foundation 提醒框
Foundation 圖標(biāo)
Foundation 圖片
Foundation 文本
Foundation 下拉菜單
Foundation 選項卡
Foundation 折疊列表
Foundation 手冊
Foundation CSS 參考手冊
Foundation CSS 可見性
Foundation 圖標(biāo)參考手冊
Foundation 網(wǎng)格
Foundation 塊狀網(wǎng)格
Foundation 網(wǎng)格 - 大型設(shè)備
Foundation 網(wǎng)格 - 水平堆疊
Foundation 網(wǎng)格 - 小型設(shè)備
Foundation 網(wǎng)格 - 中型設(shè)備
Foundation 網(wǎng)格實例
Foundation 網(wǎng)格系統(tǒng)
?
本文檔使用 PHP中文網(wǎng)手冊 發(fā)布
文字
Foundation 面板
Foundation 面板是一個灰色邊框，內(nèi)容含有內(nèi)邊距的模塊?？梢允褂?.panel 類來創(chuàng)建:
實例
<div?class="panel"> ??<h3>標(biāo)題</h3> ??<p>文本內(nèi)容..</p> </div>實例預(yù)覽 ?
面板顏色
使用 .callout 類將面板顏色修改為淺藍(lán)：
實例
<div?class="panel?callout"> ??<h3>標(biāo)題</h3> ??<p>文本內(nèi)容..</p> </div>實例預(yù)覽 ?
圓角面板
使用 .radius 類將面板設(shè)置為圓角：
實例
<div?class="panel?radius"> ??<h3>標(biāo)題</h3> ??<p>文本內(nèi)容..</p> </div>實例預(yù)覽 ?
自定義面板
可以使用 CSS 來自定義面板，以下實例中我們將面板作為一個卡片：
實例
<style>
.panel?{
????padding:?0;
????border:?none;
????width:?50%;
}
div.container?{
????text-align:?center;
????padding:?15px;
????margin-top:?20px;
}
img?{
????width:?100%;
}
</style>
<div?class="panel">
??<img?src="http://ku.shouce.ren/files/images/201603/56e184762dc19.jpg"?alt="Cinque?Terre">?
??<div?class="container">
????<h4>長城</h4>
????<p>不到長城非好漢?。。?lt;/p>
??</div>
</div>實例預(yù)覽 ?關(guān)于我們 聯(lián)系我們 留言板
手冊網(wǎng)