Foundation 網(wǎng)格 - 水平堆疊

以下實例創(chuàng)建了一個基本的網(wǎng)格系統(tǒng)，在 PC 和平板設備上它是水平平鋪的，在手機等小型設備上它是水平堆疊的。

創(chuàng)新互聯(lián)公司是一家專業(yè)的成都網(wǎng)站建設公司，我們專注網(wǎng)站建設、成都網(wǎng)站制作、網(wǎng)絡營銷、企業(yè)網(wǎng)站建設，賣鏈接，廣告投放為企業(yè)客戶提供一站式建站解決方案，能帶給客戶新的互聯(lián)網(wǎng)理念。從網(wǎng)站結(jié)構(gòu)的規(guī)劃UI設計到用戶體驗提高，創(chuàng)新互聯(lián)力求做到盡善盡美。

實例

<
div
class=
"row"
>

  
<
div
class=
"medium-6 columns"
style=
"background-color:yellow;"
>

    
<
p
>菜鳥教程
<
/p
>

  
<
/div
>

  
<
div
class=
"medium-6 columns"
style=
"background-color:pink;"
>

    
<
p
>菜鳥教程
<
/p
>

  
<
/div
>


<
/div
>

嘗試一下 ?

	提示: .small|medium|large-* 類中的數(shù)字指定了跨越的列數(shù)。所以， .small-1 跨越 1 列, .small-4 跨越 4 列, .small-6 跨越 6 列 (50% 寬度) 等。 注意: 要保證數(shù)列加起來是 12 列!

名稱欄目：創(chuàng)新互聯(lián)Foundation教程：Foundation網(wǎng)格-水平堆疊
URL分享：http://fisionsoft.com.cn/article/cdoigde.html