純前端表格控件SpreadJS，兼容 450 種以上的 Excel 公式，具備“高性能、跨平臺、與 Excel 高度兼容”的產品特性，備受華為、蘇寧易購、天弘基金等行業龍頭企業的青睞，并被中國軟件行業協會認定為“中國優秀軟件產品”。SpreadJS 可為用戶提供類 Excel 的功能，滿足表格文檔協同編輯、 數據填報、 類 Excel 報表設計等業務場景需求，極大的降低企業研發成本和項目交付風險。

下載最新版SpreadJS

此示例顯示如何自定義工作簿背景

你可以設置 backColor 或者 backgroundImage 選項為每一個表單設置背景色或者背景圖片。如果你同時設置背景色和背景圖片, 那么背景圖片將會優先顯示。

    var spread = GC.Spread.Sheets.findControl(document.getElementById('ss'));      // set the worksheet's backcolor      spread.options.backColor = 'red';      // and set the surrounding area      spread.options.grayAreaBackColor = 'gray';  

或者，您可以使用workbook的** backgroundImage **選項為工作表設置背景圖像。請注意，設置背景圖像會覆蓋所有設置的背景顏色，因此必須將其刪除才能使背景顏色生效。

    var spread = GC.Spread.Sheets.findControl(document.getElementById('ss'));      // Set a background image for the sheets      spread.options.backgroundImage = 'images/backImage.png';  

SpreadJS 提供控制圖片布局方式的能力, 你可以設置 backgroundImageLayout 選項來完成此目標。圖片布局包含以下幾種類型:

• stretch: 改變圖像尺寸使其充滿整個區域,無視實際的長寬比。
• center: 圖片將顯示在區域的正中央。
• zoom: 改變圖像的尺寸使其適合控件尺寸,圖片實際的長寬比不變。
• none: 在顯示區域中使用圖像實際的尺寸顯示該圖像,沒有任何尺寸變化。

    spread.options.backgroundImageLayout = GC.Spread.Sheets.ImageLayout.stretch;      //spread.options.backgroundImageLayout = GC.Spread.Sheets.ImageLayout.center;      //spread.options.backgroundImageLayout = GC.Spread.Sheets.ImageLayout.zoom;      //spread.options.backgroundImageLayout = GC.Spread.Sheets.ImageLayout.none;  

你也可以設置 grayAreaBackColor 選項來設置表單灰色區域的背景色。

spread.options.grayAreaBackColor = 'gray';

本文轉載自：

立即下載最新版純前端表格控件SpreadJS體驗吧！