Foundation 面闆

Foundation 面闆是一個灰色邊框，内容含有内邊距的子產品。可以使用 <code>.panel</code> 類來建立:

&lt;div class="panel"&gt;

  &lt;h3&gt;标題&lt;/h3&gt;

&lt;p&gt;文本内容..&lt;/p&gt;

&lt;/div&gt;

使用 <code>.callout</code> 類将面闆顔色修改為淺藍：

&lt;div class="panel callout"&gt;

使用 <code>.radius</code> 類将面闆設定為圓角：

&lt;div class="panel radius"&gt;

可以使用 CSS 來自定義面闆，以下執行個體中我們将面闆作為一個卡片：

&lt;style&gt;

.panel {

    padding: 0;

border: none;

    width: 50%;

}

div.container {

    text-align: center;

padding: 15px;

    margin-top: 20px;

img {

    width: 100%;

&lt;/style&gt;

  &lt;img src="http://www.runoob.com/wp-content/uploads/2015/11/20121204024112919.jpg" alt="Cinque

Terre"&gt;

  &lt;div class="container"&gt;

&lt;h4&gt;長城&lt;/h4&gt;

    &lt;p&gt;不到長城非好漢！！！&lt;/p&gt;