Foundation 價(jià)格表

價(jià)格表可用于展示企業(yè)產(chǎn)品:

創(chuàng)新互聯(lián)公司是一家集網(wǎng)站建設(shè),定結(jié)企業(yè)網(wǎng)站建設(shè),定結(jié)品牌網(wǎng)站建設(shè),網(wǎng)站定制,定結(jié)網(wǎng)站建設(shè)報(bào)價(jià),網(wǎng)絡(luò)營(yíng)銷(xiāo),網(wǎng)絡(luò)優(yōu)化,定結(jié)網(wǎng)站推廣為一體的創(chuàng)新建站企業(yè)，幫助傳統(tǒng)企業(yè)提升企業(yè)形象加強(qiáng)企業(yè)競(jìng)爭(zhēng)力?？沙浞譂M(mǎn)足這一群體相比中小企業(yè)更為豐富、高端、多元的互聯(lián)網(wǎng)需求。同時(shí)我們時(shí)刻保持專(zhuān)業(yè)、時(shí)尚、前沿，時(shí)刻以成就客戶(hù)成長(zhǎng)自我，堅(jiān)持不斷學(xué)習(xí)、思考、沉淀、凈化自己，讓我們?yōu)楦嗟钠髽I(yè)打造出實(shí)用型網(wǎng)站。

實(shí)例

<
ul
class=
"pricing-table"
>

 
<
li
class=
"title"
>Basic
<
/li
>

 
<
li
class=
"price"
>$19.99
<
/li
>

 
<
li
class=
"description"
>Great for small business
<
/li
>

 
<
li
class=
"bullet-item"
>24/7 Support
<
/li
>

 
<
li
class=
"bullet-item"
>15GB Storage
<
/li
>

 
<
li
class=
"bullet-item"
>1GB Bandwidth
<
/li
>

 
<
li
class=
"cta-button"
>
<
a
class=
"button"
href=
"#"
>Buy
<
/a
>
<
/li
>


<
/ul
>

嘗試一下 ?

實(shí)例解析

• ul.pricing-table - 定義價(jià)格表
• li.title - 定義產(chǎn)品標(biāo)題 (黑色背景)
• li.price - 定義價(jià)格 (灰色背景字體大個(gè)項(xiàng))
• li.description - 定義產(chǎn)品描述 (如果需要)
• li.bullet-item - 定義產(chǎn)品特點(diǎn)
• li.ca-button - 按鈕文本 (如 "Buy", "Join", "Sign Up", 等)

注意:表格會(huì) 100% 填充容器的寬度，所有的項(xiàng)都有邊框且是居中的。

---

價(jià)格表網(wǎng)格

以下實(shí)例顯示了三個(gè)企業(yè)產(chǎn)品的價(jià)格（三項(xiàng)是均等劃分寬度的）：

實(shí)例

<
div
class=
"row"
>

 
<
div
class=
"medium-4 columns"
>

   
<
ul
class=
"pricing-table"
>

     
<
li
class=
"title"
>Basic
<
/li
>

      ...

   
<
/ul
>

 
<
/div
>

 
<
div
class=
"medium-4 columns"
>

   
<
ul
class=
"pricing-table"
>

     
<
li
class=
"title"
>Pro
<
/li
>

      ...

   
<
/ul
>

 
<
/div
>

 
<
div
class=
"medium-4 columns"
>

   
<
ul
class=
"pricing-table"
>

     
<
li
class=
"title"
>Premium
<
/li
>

      ...

   
<
/ul
>

 
<
/div
>


<
/div
>

嘗試一下 ?

文章題目：創(chuàng)新互聯(lián)Foundation教程：Foundation價(jià)格表
本文路徑：http://www.dlmjj.cn/article/dpcedoi.html