列印

列印工具包含新增至控制列的按鈕，以及啟動工具時顯示的強制回應對話方塊。

使用以下CSS類選擇器控制打印按鈕的外觀：

.s7ecatalogsearchviewer .s7print

打印按鈕的CSS屬性

邊距上	從控制欄頂端的偏移。
左邊距	左側的下一個按鈕的距離；如果控制欄的左側是一行中的第一個按鈕，則與下一個按鈕的距離。
width	按鈕的寬度。
height	按鈕的高度。
背景 — 影像	針對指定按鈕狀態顯示的影像。
背景位置	如果使用CSS精靈，則位於圖稿精靈內。另請參閱 CSS Sprite .

注意

此按鈕支援 state 屬性選取器，可用來將不同的外觀套用至不同的按鈕狀態。

按鈕工具提示可以本地化。請參閱用戶介面元素本地化以取得更多資訊。

範例 — 設定28 x 28像素的列印按鈕，並針對四個不同按鈕狀態中的每一個顯示不同的影像。

.s7ecatalogsearchviewer .s7print {
margin-top: 4px;
margin-left: 10px;
 width:28px;
 height:28px;
}
.s7ecatalogsearchviewer .s7print[state='up'] {
background-image:url(images/v2/Print_dark_up.png);
}
.s7ecatalogsearchviewer .s7print[state='over'] {
background-image:url(images/v2/Print_dark_over.png);
}
.s7ecatalogsearchviewer .s7print[state='down'] {
background-image:url(images/v2/Print_dark_down.png);
}
.s7ecatalogsearchviewer .s7print[state='disabled'] {
background-image:url(images/v2/Print_dark_disabled.png);
}

當對話方塊作用中時，會覆蓋網頁的背景覆蓋圖會由下列CSS類別選取器控制：

.s7ecatalogsearchviewer .s7printdialog .s7backoverlay

背面覆蓋的CSS屬性

不透明度	背景覆蓋圖不透明度。
背景顏色	背景覆蓋圖顏色。

範例：若要將背景覆蓋設定為灰色且不透明度為70%:

.s7ecatalogsearchviewer .s7printdialog .s7backoverlay {
 opacity:0.7;
 background-color:#222222;
}

預設情況下，強制回應對話方塊會顯示在案頭系統的畫面中央。對話框的定位和大小由元件管理。對話方塊由下列CSS類別選取器控制：

.s7ecatalogsearchviewer .s7kprintdialog .s7dialog

對話框的CSS屬性

邊框半徑	對話框邊框半徑。
背景顏色	對話框背景顏色；

範例：若要設定具有灰色背景的對話方塊：

.s7ecatalogsearchviewer .s7printdialog .s7dialog {
background-color: #dddddd;
}

對話框標題由表徵圖、標題文本和關閉按鈕組成。標題容器可透過下列CSS類別選取器控制：

.s7ecatalogsearchviewer .s7printdialog .s7dialogheader

對話框標題的CSS屬性

填補	頁首內容的內部邊框間距。

圖示和標題文字會包裝在以下項目控制的額外容器中：

.s7ecatalogsearchviewer .s7printdialog .s7dialogheader .s7dialogline

對話框行的CSS屬性

填補	頁首圖示和標題的內邊框間距。

使用下列CSS類選擇器控制標題表徵圖：

.s7ecatalogsearchviewer .s7printdialog .s7dialogheadericon

對話框標題表徵圖的CSS屬性

寬度	圖示寬度。
高度	圖示高度。
背景 — 影像	圖示影像。
背景位置	如果使用CSS精靈，則位於圖稿精靈內。另請參閱 CSS Sprite .

使用下列CSS類選擇器控制標題：

.s7ecatalogsearchviewer .s7printdialog .s7dialogheadertext

對話框標題文本的CSS屬性

字型粗細	字型寬度。
字型大小	字型高度。
字型系列	字型系列。
填補	內部文字邊框間距。

使用下列CSS類選擇器控制關閉按鈕：

.s7ecatalogsearchviewer .s7printdialog .s7closebutton

關閉按鈕的CSS屬性

頂部	相對於標題容器的垂直按鈕位置。
右側	相對於標題容器的水準按鈕位置。
寬度	按鈕寬度。
高度	按鈕高度。
填補	按鈕的內邊框間距。
背景 — 影像	每個狀態的按鈕影像。
背景位置	如果使用CSS精靈，則位於圖稿精靈內。另請參閱 CSS Sprite .

注意

此按鈕支援 state 屬性選取器，可用來將不同的外觀套用至不同的按鈕狀態。

「關閉」按鈕工具提示和對話框標題可以本地化。請參閱用戶介面元素本地化以取得更多資訊。

範例 — 若要使用邊框間距、22 x 22像素圖示和粗體16點標題來設定對話方塊標題。最後，28 x 28像素的「關閉」按鈕從頂部放置兩個像素，從對話框容器的右側放置兩個像素：

.s7ecatalogsearchviewer .s7printdialog .s7dialogheader {
 padding: 10px;
}
.s7ecatalogsearchviewer .s7printdialog .s7dialogheader .s7dialogline {
 padding: 10px 10px 2px;
}
.s7ecatalogsearchviewer .s7printdialog .s7dialogheadericon {
    background-image: url("images/sdk/dlgprint_cap.png");
    height: 22px;
    width: 22px;
}
.s7ecatalogsearchviewer .s7printdialog .s7dialogheadertext {
    font-size: 16pt;
    font-weight: bold;
    padding-left: 16px;
}
.s7ecatalogsearchviewer .s7printdialog .s7closebutton {
 top:2px;
 right:2px;
 padding:8px;
 width:28px;
 height:28px;
}
.s7ecatalogsearchviewer .s7printdialog .s7closebutton[state='up'] {
 background-image:url(images/sdk/close_up.png);
}
.s7ecatalogsearchviewer .s7printdialog .s7closebutton[state='over'] {
 background-image:url(images/sdk/close_over.png);
}
.s7ecatalogsearchviewer .s7printdialog .s7closebutton[state='down'] {
 background-image:url(images/sdk/close_down.png);
}
.s7ecatalogsearchviewer .s7printdialog .s7closebutton[state='disabled'] {
 background-image:url(images/sdk/close_disabled.png);
}

對話框頁尾由取消和發送到打印按鈕組成。頁尾容器可透過下列CSS類別選取器控制：

.s7ecatalogsearchviewer .s7printdialog .s7dialogfooter

對話框頁尾的CSS屬性

border

可用於以視覺方式將頁尾與對話框其餘部分分開的邊框。

頁尾有一個內容器，可保留兩個按鈕。它由下列CSS類別選取器控制：

.s7ecatalogsearchviewer .s7printdialog .s7dialogbuttoncontainer

對話框按鈕容器的CSS屬性

填補	頁尾和按鈕之間的內邊框間距。

使用下列CSS類選擇器控制取消按鈕：

.s7ecatalogsearchviewer .s7printdialog .s7dialogcancelbutton

對話框取消按鈕的CSS屬性

寬度	按鈕寬度。
高度	按鈕高度。
color	每個狀態的按鈕文字顏色。
背景顏色	每個狀態的按鈕背景顏色。

注意

此按鈕支援 state 屬性選取器，可用來將不同的外觀套用至不同的按鈕狀態。

使用以下CSS類選擇器控制「發送到打印」按鈕：

.s7ecatalogsearchviewer .s7printdialog .s7dialogactionbutton

對話框操作按鈕的CSS屬性

寬度	按鈕寬度。
高度	按鈕高度。
色彩	每個狀態的按鈕文字顏色。
背景顏色	每個狀態的按鈕背景顏色。

注意

此按鈕支援 state 屬性選取器，可用來將不同的外觀套用至不同的按鈕狀態。

此外，這兩個按鈕都共用通用的CSS類，這些類可以包含其他對話框按鈕相同的CSS設定：

.s7ecatalogsearchviewer .s7printdialog .s7dialogfooter .s7button

按鈕的CSS屬性

字型粗細	按鈕字型寬度。
字型大小	按鈕字型大小。
字型系列	按鈕字型系列。
線高	按鈕內的文字高度。影響垂直對齊。
框陰影	陰影。
邊距 — 右	右鍵邊距。

按鈕工具提示可翻譯。請參閱用戶介面元素本地化以取得更多資訊。

示例 — 要設定一個對話框頁尾，其中「64 x 34取消」按鈕和「96 x 34發送到打印」按鈕，每個按鈕狀態的文本顏色和背景顏色不同：

.s7ecatalogsearchviewer .s7printdialog .s7dialogfooter {
    border-top: 1px solid #909090;
}
.s7ecatalogsearchviewer .s7printdialog .s7dialogbuttoncontainer {
    padding-bottom: 6px;
    padding-top: 10px;
}
.s7ecatalogsearchviewer .s7printdialog .s7dialogfooter .s7button {
    box-shadow: 1px 1px 1px #999999;
    color: #FFFFFF;
    font-size: 9pt;
    font-weight: bold;
    line-height: 34px;
    margin-right: 10px;
}
.s7ecatalogsearchviewer .s7printdialog .s7dialogcancelbutton {
 width:64px;
 height:34px;
}
.s7ecatalogsearchviewer .s7printdialog .s7dialogcancelbutton[state='up'] {
 background-color:#666666;
 color:#dddddd;
}
.s7ecatalogsearchviewer .s7printdialog .s7dialogcancelbutton[state='down'] {
 background-color:#555555;
 color:#ffffff;
}
.s7ecatalogsearchviewer .s7printdialog .s7dialogcancelbutton[state='over'] {
 background-color:#555555;
 color:#ffffff;
}
.s7ecatalogsearchviewer .s7printdialog .s7dialogcancelbutton[state='disabled'] {
 background-color:#b2b2b2;
 color:#dddddd;
}
.s7ecatalogsearchviewer .s7printdialog .s7dialogactionbutton {
 width:96px;
 height:34px;
}
.s7ecatalogsearchviewer .s7printdialog .s7dialogactionbutton[state='up'] {
 background-color:#333333;
 color:#dddddd;
}
.s7ecatalogsearchviewer .s7printdialog .s7dialogactionbutton[state='down'] {
 background-color:#222222;
 color:#cccccc;
}
.s7ecatalogsearchviewer .s7printdialog .s7dialogactionbutton[state='over'] {
 background-color:#222222;
 color:#cccccc;
}
.s7ecatalogsearchviewer .s7printdialog .s7dialogactionbutton[state='disabled'] {
 background-color:#b2b2b2;
 color:#dddddd;
}

主對話框區域（在頁首和頁尾之間）包含對話框內容。在所有情況下，元件會管理此區域的寬度，因此無法在CSS中設定它。主對話框區域由以下CSS類選擇器控制：

.s7ecatalogsearchviewer .s7printdialog .s7dialogviewarea

對話框查看區域的CSS屬性

高度	主對話框區域的高度。
背景顏色	主對話框區域的背景顏色。
margin	外邊距。

範例：若要設定主對話方塊區域，使其具有自動計算的高度、10個像素邊界，並使用白色背景：

.s7ecatalogsearchviewer .s7printdialog .s7dialogviewarea {
 background-color:#ffffff;
 margin:10px;
 height:auto;
}

所有表單內容（如標籤和輸入欄位）都駐留在由以下CSS類選擇器控制的容器內：

.s7ecatalogsearchviewer .s7printdialog .s7dialogbody

對話框主體的CSS屬性

填補

內部填充。

範例：若要設定表單內容，應有十個像素邊框間距：

.s7ecatalogsearchviewer .s7printdialog .s7dialogbody {
    padding: 10px;
}

對話框表單逐行填充，每行包含表單內容的一部分（如標籤和文本輸入欄位）。使用下列CSS類選擇器控制單一表單行：

.s7ecatalogsearchviewer .s7emaildialog .s7dialogbody .s7dialogline

對話框行的CSS屬性

填補

內線邊框間距。

範例：若要設定對話方塊表單，讓每行有10個像素邊框間距：

.s7ecatalogsearchviewer .s7emaildialog .s7dialogbody .s7dialogline {
    padding: 10px;
}

對話內容區塊的大小由下列CSS類別選取器控制：

 .s7ecatalogsearchviewer .s7printdialog .s7dialoginputwide

對話框輸入寬度的CSS屬性

寬度	塊寬度。
填補	內線邊框間距。

範例：若要將內容區塊設為430像素寬，且底部有10像素邊框間距：

.s7ecatalogsearchviewer .s7printdialog .s7dialoginputwide {
    padding-bottom: 10px;
    width: 430px;
}

對話框窗體中的所有靜態標籤都使用以下CSS類選擇器進行控制：

.s7ecatalogsearchviewer .s7printdialog .s7dialoglabel

此類不適合控制標籤大小或位置，因為您可以將其應用於表單用戶介面中各個位置的文本。

對話框標籤的CSS屬性。 

字型粗細	標籤字型寬度。
字型大小	標籤字型大小。
字型系列	標籤字型系列。
色彩	標籤文本顏色。

對話方塊標籤可以翻譯。請參閱用戶介面元素本地化以取得更多資訊。

範例：若要將所有標籤設為灰色、粗體、九像素字型：

.s7ecatalogsearchviewer .s7printdialog .s7dialoglabel {
    color: #666666;
    font-size: 9pt;
    font-weight: bold;
}

輸入控制項會包裝到容器中，並使用下列CSS類別選取器加以控制：

.s7ecatalogsearchviewer .s7printdialog .s7dialoginputcontainer

對話框輸入容器的CSS屬性

向左邊框間距

內部填充。

範例 — 從對話方塊的左側邊緣設定30像素邊框間距。

.s7ecatalogsearchviewer .s7printdialog .s7dialoginputcontainer {
    padding-left: 30px;
}

選項按鈕及其標題文本由以下CSS類選擇器控制：

.s7ecatalogsearchviewer .s7printdialog .s7dialogoption

對話框選項的CSS屬性

寬度	帶有字幕的單選按鈕的總寬度。
色彩	註解文本顏色。

選項按鈕與其標題之間的間距由以下CSS類選擇器控制：

.s7ecatalogsearchviewer .s7printdialog .s7dialogoptioninput

對話框選項輸入的CSS屬性

邊距 — 右

選項按鈕與其標題之間的間距。

打印範圍選擇的數值選擇器由以下CSS類選擇器控制

.s7ecatalogsearchviewer .s7printdialog .s7dialogrange

對話框打印範圍的CSS屬性

寬度	數值選擇器的寬度。
邊際	數值選擇器周圍的間距。

範例：若要將所有選項按鈕設定為150像素寬、黑色文字、10像素間距和42像素寬的數字選取器：

.s7ecatalogsearchviewer .s7printdialog .s7dialogoption {
    color: #000000;
    width: 150px;
}
.s7ecatalogsearchviewer .s7printdialog .s7dialogoption input {
    margin-right: 10px;
}
.s7ecatalogsearchviewer .s7printdialog .s7dialogrange {
    margin-left: 10px;
    margin-right: 10px;
    width: 42px;
}

頁面範圍選取項目與列印版面區段之間的水準分隔線，是透過下列CSS類別選取器來控制：

 .s7ecatalogsearchviewer
.s7printdialog .s7horizontaldivider

水準分隔線的CSS屬性

邊框	分隔線周圍的邊框。
填補	內部填充。
寬度	分隔線寬度。
邊際	外邊界

範例 — 若要設定430像素寬度灰度分隔線，其兩側各有10個像素垂直邊框，頂部有10個像素邊界：

.s7ecatalogsearchviewer .s7printdialog .s7horizontaldivider {
    border-top: 1px solid #aaaaaa;
    margin-top: 10px;
    padding-bottom: 10px;
    padding-top: 10px;
    width: 430px;
}

Business.Adobe.com 資源

Style System Targeted Content Theme Editor Managed Cloud Headless Cms Content Management System

列印

Business.Adobe.com 資源

本頁內容

檢視下一個:

學習

說明文件

社群

技術支援

資源

Adobe 帳戶

Adobe