新增圖示以指出使用中和已完成的標籤

當您有具有左標籤導覽的適用性表單時，您可能想要顯示圖示以指出標籤的狀態。 例如，您想要顯示一個圖示來指示使用中標籤，並顯示圖示來指示已完成標籤，如下方螢幕擷取所示。

工具欄間距

建立最適化表單

使用基本範本和畫布3.0主題的簡單適用性表單來建立範例表單。
此 本文中使用的表徵圖 可從此處下載。

設定預設狀態的樣式

在編輯模式下開啟表單確保您位於樣式層中，並選擇任何頁簽（例如「常規」頁簽）。
如下方螢幕擷取畫面所示，開啟標籤的樣式編輯器時，您會處於預設狀態
導覽標籤

設定預設狀態的CSS屬性，如下所示 |類別 |屬性名稱 |屬性值 | |:—|:—|:—| |Dimension和位置 |寬度 | 50px | |文字 |字型寬度|粗體 | |文字 |色彩 | #FFF | |文本 |行高| 3 | |文本 |文字對齊 |左側 | |背景|顏色 | #056dae |

儲存您的變更

設定活動狀態的樣式

請確定您處於「使用中」狀態，並為下列CSS屬性設定樣式

類別 屬性名稱 屬性值
Dimension和位置 寬度 50px
文字 字粗 粗體
文字 彩色 #FFF
文字 行高 3
文字 文字對齊 左
背景 彩色 #056dae

設定背景影像的樣式，如下方螢幕擷取畫面所示

儲存您的變更。

活動狀態

設定被訪問狀態的樣式

確定您處於已造訪狀態，並設定下列屬性的樣式

類別 屬性名稱 屬性值
Dimension和位置 寬度 50px
文字 字粗 粗體
文字 彩色 #FFF
文字 行高 3
文字 文字對齊 左
背景 彩色 #056dae

設定背景影像的樣式，如下方螢幕擷取畫面所示

被訪問狀態

儲存您的變更

預覽表單並測試圖示是否如預期運作。

本頁內容