曾幾何時(shí)，報(bào)表僅僅作為數(shù)據(jù)的表格化（圖表化）呈現(xiàn)，對于其本身的外觀關(guān)注的并不是我們最關(guān)注的方面，比如下面兩張報(bào)表：

以上圖片來自百度搜索

作為現(xiàn)今顏值第一的準(zhǔn)則，數(shù)據(jù)報(bào)表除了完整的表現(xiàn)數(shù)據(jù)準(zhǔn)確真實(shí)之外，外觀則是打動(dòng)觀者的第一要素，以下是15條簡單易行的提升報(bào)表外觀的技巧。

小貼士

以下技巧通過葡萄城報(bào)表在線設(shè)計(jì)器中作為示例演示，你也可以在線體驗(yàn)

技巧一：表格宜寬不宜窄

要想做出美觀大方的表格，首先一條是不要設(shè)計(jì)太窄的表格。

要將表格變寬，有兩個(gè)辦法：一是增加表格的列數(shù)，另一個(gè)是拉寬表格列寬。下圖為一個(gè)僅有兩列的表格：

拉寬之后，表格將更加勻稱，如下圖：

技巧二：表格線框慎用純黑色

默認(rèn)的表格框線都是黑色，往往給人生硬的感覺。改用深灰色的框線，視覺效果會(huì)更好。

選中表格整行整列或者選中單個(gè)或多個(gè)單元格，設(shè)置邊框樣式，如下圖：

技巧三：合適的文字對齊方式

表格文字的對齊方式包括水平對齊和垂直對齊兩種屬性。

對于長度較短的文字，比如ID、日期、分類名稱等，居中顯示效果會(huì)更好。但是請注意：數(shù)量、金額類字段，一般應(yīng)居右對齊。

垂直對齊方式，如果設(shè)置為【頂端對齊】或【底端對齊】，都會(huì)比較難看。設(shè)置為【垂直居中】則會(huì)更美觀。

設(shè)置文字對齊方式的選項(xiàng)如下圖：

技巧四：標(biāo)題加粗并居中

無論對應(yīng)字段類型或數(shù)據(jù)長度如何，表格欄目的標(biāo)題文字都應(yīng)居中顯示并加粗。選中表頭的單元格，點(diǎn)擊菜單欄下方 Ribbon 工具條上的相應(yīng)按鈕即可設(shè)置字體加粗和居中，如下圖：

技巧五：標(biāo)題行深色背景

表格標(biāo)題行最好使用較深的背景色（如深藍(lán)），同時(shí)將文字顏色設(shè)置為淺色（如白色）。

選中表頭單元格，設(shè)置【背景選項(xiàng)】和【文本字體】中的顏色，如下圖：

技巧六：表格交替行背景色

表格奇偶行交替背景色可有效改善視覺效果。選中整個(gè)表格（而不是個(gè)別單元格），從【外觀樣式】下拉框中選擇一個(gè)含交替行顏色的樣式，如下圖：

表格報(bào)表美化效果

技巧七：圖表中的內(nèi)容慎用黑色

圖表中的內(nèi)容包括文字和圖形，比如圖表標(biāo)題、坐標(biāo)軸線。要想圖表好看，所有內(nèi)容都要盡量避免使用黑色，而應(yīng)使用深灰色或者其他顏色。

設(shè)置圖表中的文字顏色，請先點(diǎn)擊工具箱頂部的【元素管理】圖標(biāo)，展開報(bào)表元素樹形目錄，選中其中的【圖表標(biāo)題】等元素，如下圖：

選中某個(gè)元素時(shí)，設(shè)計(jì)器右側(cè)的選項(xiàng)列表會(huì)根據(jù)元素類型動(dòng)態(tài)變化。每個(gè)元素可能有多種【顏色】選項(xiàng)，比如背景色、字體顏色、邊框顏色等，如下圖：

將其中的黑色（Black）改為深灰色（DarkGray）。

對于背景色，可將透明色（Transparent）改為淺灰色（如#fafafa）。

技巧八：繪圖區(qū)使用網(wǎng)格線背景

柱形圖和條形圖中，如果數(shù)據(jù)較少，繪圖區(qū)可能呈現(xiàn)大片空白，顯得內(nèi)容不夠豐富。設(shè)置X軸和Y軸的網(wǎng)格線，可令圖表線條更為豐富。

先在【元素管理中選中【分類坐標(biāo)軸】或者【數(shù)據(jù)坐標(biāo)軸Y1】，然后設(shè)置【主網(wǎng)格線】的【顯示】為【是】，然后設(shè)置適當(dāng)?shù)摹揪€型】和【顏色】，如下圖：

技巧九：繪圖區(qū)設(shè)置背景色

將繪圖區(qū)設(shè)置淡灰色（WhiteSmoke）的背景色，可將繪圖區(qū)與坐標(biāo)軸線之外的其他元素區(qū)分開來，提升視覺效果。

注意是在【元素管理】中選中【繪圖區(qū)域】，而不是選中整個(gè)圖表，再設(shè)置背景顏色。如下圖：

技巧十：圖形與軸線之間留空

柱形圖或條形圖中，如果第一個(gè)柱形緊貼Y軸，不太美觀。對此，可勾選X軸的【邊距】選項(xiàng)，使得第一個(gè)柱形與Y軸之間留出空隙。如下圖：

技巧十一：設(shè)置X軸標(biāo)簽文字方向

X軸坐標(biāo)點(diǎn)的標(biāo)記，往往是類別字段的值，比如月份、部門名稱等。有時(shí)這些字段值可能比較長，導(dǎo)致多個(gè)X軸點(diǎn)的文字疊在一起。通過設(shè)置【分類坐標(biāo)軸】標(biāo)簽文字的【顯示方向】，可解決此問題。如下圖：

技巧十二：設(shè)置圖例

圖例可以清楚地說明每一個(gè)【系列】所代表的含義。

柱形圖中的系列，是指一個(gè)X軸數(shù)據(jù)點(diǎn)對應(yīng)的多個(gè)Y軸數(shù)據(jù)。如下圖：

多系列圖表中，圖例可以清楚地說明每一個(gè)柱形所代表的含義。上圖中右側(cè)的圖例，就是為了說明哪些柱形是銷售額，哪個(gè)柱形是搭贈(zèng)費(fèi)用。

如果是一個(gè)單系列的柱形圖，圖例就失去顯示的意義了。對此可設(shè)置圖例不顯示。

設(shè)置圖例的方法是：

點(diǎn)擊工具箱頂部的【元素管理】圖標(biāo)，展開圖表的元素。選中【圖例】，如下圖：

對于單系列圖表，將【顯示】設(shè)置為【否】；對于多系列圖表，設(shè)置【類型】和【位置】使之更美觀。另外，還可以設(shè)置圖例的字體、顏色等，使之與圖表其他元素更為協(xié)調(diào)。

圖表類美化效果

原始圖表

美化后

技巧十三：放棄“宋體”及“黑體”

字體設(shè)置，建議一律使用【微軟雅黑】。

技巧十四：配色方案

尤其是在圖表類報(bào)表中，主要顏色不要超過3種，顏色搭配可以參考專業(yè)的網(wǎng)站，如：

https://coolors.co/browser/best/1

http://www.paletton.com/

技巧十五：圖表混合式，上下布局

小貼士

以上技巧通過葡萄城報(bào)表在線設(shè)計(jì)器中作為示例演示，你也可以在線體驗(yàn)

關(guān)于 葡萄城

賦能開發(fā)者！葡萄城公司成立于 1980 年，是全球領(lǐng)先的集開發(fā)工具、商業(yè)智能解決方案、管理系統(tǒng)設(shè)計(jì)工具于一身的軟件和服務(wù)提供商。西安葡萄城是其在中國的分支機(jī)構(gòu)，面向全球市場提供軟件研發(fā)服務(wù)，并為中國企業(yè)的信息化提供國際先進(jìn)的開發(fā)工具、軟件和研發(fā)咨詢服務(wù)。葡萄城的控件和軟件產(chǎn)品在國內(nèi)外屢獲殊榮，在全球被數(shù)十萬家企業(yè)、學(xué)校和政府機(jī)構(gòu)廣泛應(yīng)用。

創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎(jiǎng)勵(lì)來咯，堅(jiān)持創(chuàng)作打卡瓜分現(xiàn)金大獎(jiǎng)

總結(jié)

以上是生活随笔為你收集整理的【在线报表设计】提升报表外观的15个技巧的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。