表格 Table

在頁面中適當使用表格,如需要比對行為或陳列需求等...,可以將資訊整齊規律的呈現。

標題使用藍色來與內容做區隔,而內容會使用白(#FFFFFF)灰(#F5F5F5)相間的底色與灰線(#CCC)來區分每一行資訊差異。

在表格中會有著以下元素:

  1. 表格標題 ( 字級:18px / 文字顏色:#333 )

  2. 顯示筆數 ( 字級:18px / 文字顏色:#777 )

  3. 資訊標提 ( 字級:15px / 文字顏色:#FFF / 背景色:#2FA4DB )

  4. 資訊內容 ( 字級:15px / 文字顏色:#333 / 複數列背景色:#F5F5F5 / 分隔線:1px solid #CCC )

  5. 工具欄 ( 邊框:1px solid #CCC / 背景色:#F5F5F5 )

    1. 頁碼 ( 字級:15px / 文字顏色:#444 / 目前頁背景色:#DDD )

    2. 主功能按鈕 ( 字級:16px / 文字顏色:#FFF / 背景色:#2FA4DB / 粗細:500 )

    3. 副功能按鈕 ( 字級:16px / 文字顏色:#FFF / 背景色:#40D4B2 / 粗細:500 )

Last updated

Was this helpful?