如何使用 Illustrator 中的切片和圖像映射?ai切片工具怎么用

Illustrator是一款由Adobe公司設(shè)計的全球最為知名的矢量圖形軟件。借助這款行業(yè)標準的矢量圖形軟件,您可以制作適用于印刷、Web、視頻和移動設(shè)備的徽標、圖標、繪圖、版式和插圖。
關(guān)于切片
網(wǎng)頁可以包含許多元素 – HTML 文本、位圖圖像和矢量圖等等。在 Illustrator 中,可以使用切片來定義圖稿中不同 Web 元素的邊界。例如,如果圖稿包含需要以 JPEG 格式進行優(yōu)化的位圖圖像,而圖像其他部分更適合作為 GIF 文件進行優(yōu)化,則可以使用切片隔離位圖圖像。使用“存儲為 Web 和設(shè)備所用格式”命令將圖稿存儲為網(wǎng)頁時,您可以選擇將每個切片存儲為自身具有格式、設(shè)置以及顏色表的獨立文件。
Illustrator 文檔中的切片與生成的網(wǎng)頁中的表格單元格相對應(yīng)。默認情況下,切片區(qū)域可導(dǎo)出為包含于表格單元格中的圖像文件。如果希望表格單元格包含 HTML 文本和背景顏色而不是圖像文件,則可以將切片類型更改為“無圖像”。如果希望將 Illustrator 文本轉(zhuǎn)換為 HTML 文本,則可以將切片類型更改為“HTML 文本”。
使用不同切片類型的切片圖稿
A. “無圖像”切片 B. “圖像”切片 C. “HTML 文本”切片
可以在畫板上和“存儲為 Web 和設(shè)備所用格式”對話框中查看切片。Illustrator 會從圖稿的左上角開始,對切片從左到右、從上到下編號。如果更改切片的排列或切片總數(shù),切片編號則會更新,以反映新的順序。
創(chuàng)建切片時,Illustrator 會將周圍的圖稿切為自動切片,以使用基于 Web 的表格來保持布局。有兩種類型的自動切片:自動切片和子切片。自動切片指的是未定義為切片的圖稿區(qū)域。每次添加或編輯切片時,Illustrator 會重新生成自動切片。子切片表示將如何分割重疊的用戶定義切片。盡管子切片有編號并顯示切片標記,但無法獨立于底層切片選擇。在您工作時,Illustrator 將根據(jù)需要重新生成子切片和自動切片。
創(chuàng)建切片
執(zhí)行下列操作之一:
在畫板上選擇一個或多個對象,然后選擇“對象”>“切片”>“建立”。
選擇切片工具 ,并拖到要創(chuàng)建切片的區(qū)域上。按住 Shift 并拖移可將切片限制為正方形。按住 Alt (Windows) 或 Option (Mac OS) 拖移可從中心進行繪制。
在畫板上選擇一個或多個對象,然后選擇“對象”>“切片”>“從所選對象創(chuàng)建”。
將參考線放在圖稿中要創(chuàng)建切片的位置,然后選擇“對象”>“切片”>“從參考線創(chuàng)建”。
選擇一個現(xiàn)有切片,然后選擇“對象”>“切片”>“復(fù)制切片”。
提示:如果您希望切片尺寸與圖稿中某個元素的邊界匹配,請使用“對象”>“切片”>“建立”命令。如果移動或修改圖素,則切片區(qū)域會自動調(diào)整以包含新圖稿。還可以使用此命令創(chuàng)建切片,該切片可從文本對象捕捉文本和基本格式特征。
提示:如果您希望切片尺寸獨立于底層圖稿,請使用切片工具、“從所選對象創(chuàng)建”命令或“從參考線創(chuàng)建”命令。以其中任一方式創(chuàng)建的切片將顯示為“圖層”面板中的項,可以使用與其他矢量對象相同的方式移動和刪除它們以及調(diào)整其大小。
選擇切片
可以使用切片選擇工具 在插圖窗口或“存儲為 Web 和設(shè)備所用格式”對話框中選擇切片。
要選擇一個切片,請單擊該切片。
要選擇多個切片,請按住 Shift 并逐個單擊。(在“存儲為 Web 和設(shè)備所用格式”對話框中,也可以按住 Shift 并拖移。)
要在處理重疊切片時選擇底層切片,請單擊底層切片的可見部分。
此外,還可以通過執(zhí)行下列操作之一在插圖窗口中選擇切片:
要選擇使用“對象”>“切片”>“建立”命令創(chuàng)建的切片,請在畫板上選擇相應(yīng)的圖稿。若將切片捆綁到某個組或圖層,請在“圖層”面板中選擇該組或圖層旁邊的定位圖標。
要選擇使用切片工具、“從所選對象創(chuàng)建”命令或“從參考線創(chuàng)建”命令創(chuàng)建的切片,請在“圖層”面板中定位該切片。
使用“選擇”工具 單擊切片路徑。
若要選擇切片路徑線段或切片錨點,請用“直接選擇”工具單擊任一項目。
注:不能選擇自動切片。這些切片為灰顯狀態(tài)。
設(shè)置切片選項
切片的選項確定了切片內(nèi)容如何在生成的網(wǎng)頁中顯示、如何發(fā)揮作用。
用“切片選擇”工具執(zhí)行下列操作之一:
在插圖窗口中選擇一個切片,然后選擇“對象”>“切片”>“切片選項”。
在“存儲為 Web 和設(shè)備所用格式”對話框中,使用切片選擇工具雙擊某個切片。
選擇切片類型并設(shè)置對應(yīng)的選項:
圖像
如果希望切片區(qū)域在生成的網(wǎng)頁中為圖像文件,請選擇此類型。如果希望圖像是 HTML 鏈接,請輸入 URL 和目標框架。還可以指定當鼠標位于圖像上時瀏覽器的狀態(tài)區(qū)域中所顯示的信息,未顯示圖像時所顯示的替代文本,以及表單元格的背景顏色。
無圖像
如果希望切片區(qū)域在生成的網(wǎng)頁中包含 HTML 文本和背景顏色,請選擇此類型。在“在單元格中顯示的文本”文本框中輸入所需文本,并使用標準 HTML 標記設(shè)置文本格式。注意輸入的文本不要超過切片區(qū)域可以顯示的長度。(如果輸入了太多的文本,它將擴展到鄰近切片并影響網(wǎng)頁的布局。然而,因為您無法在畫板上看到文本,所以只有用 Web 瀏覽器查看網(wǎng)頁時,才會變得一目了然。) 設(shè)置“水平”和“垂直”選項,更改表格單元格中文本的對齊方式。
HTML 文本
僅當選擇文本對象并選擇“對象”>“切片”>“建立”來創(chuàng)建切片時,才能使用這種類型??梢酝ㄟ^生成的網(wǎng)頁中基本的格式屬性將 Illustrator 文本轉(zhuǎn)換為 HTML 文本。若要編輯文本,請更新圖稿中的文本。設(shè)置“水平”和“垂直”選項,更改表格單元格中文本的對齊方式。還可以選擇表格單元格的背景顏色。
提示:要在“切片選項”對話框中編輯 HTML 文本切片的文本,請將切片類型更改為“無圖像”。這樣將斷開與畫板中的文本對象的鏈接。要忽略文本格式,請輸入 <unformatted> 作為文本對象中的第一個詞。
鎖定切片
通過鎖定切片,可以防止您進行意外更改,如調(diào)整大小或移動。
要鎖定所有切片,請選擇“視圖”>“鎖定切片”。
要鎖定單個切片,請在“圖層”面板中單擊切片的編輯列。
調(diào)整切片邊界
如果使用“對象”>“切片”>“建立”命令創(chuàng)建切片,切片的位置和大小將捆綁到它所包含的圖稿。因此,如果移動圖稿或調(diào)整圖稿大小,切片邊界也會自動進行調(diào)整。
如果使用切片工具、“從所選對象創(chuàng)建”命令或“從參考線創(chuàng)建”命令創(chuàng)建切片,則可以按下列方式手動調(diào)整切片:
要移動切片,請使用切片選擇工具 將該切片拖動到一個新位置。按 Shift 可將移動限制在垂直、水平或 45 度對角線方向上。
要重新調(diào)整切片的大小,請使用切片選擇工具選擇切片,并拖動切片的任一角或邊。也可以使用選擇工具和“變換”面板來調(diào)整切片的大小。
要對齊或分布切片,請使用“對齊”面板。通過對齊切片,可以消除不必要的自動切片以生成較小且更有效的 HTML 文件。
要更改切片的堆疊順序,請將切片拖到“圖層”面板中的新位置,或者選擇“對象”>“排列”命令。
要劃分某個切片,請選擇該切片,然后選擇“對象”>“切片”>“劃分切片”。
您可以對用任意方法創(chuàng)建的切片進行組合。選擇這些切片,然后選擇“對象”>“切片”>“組合切片”。將被組合切片的外邊緣連接起來所得到的矩形,即構(gòu)成組合后的切片的尺寸和位置。如果被組合切片不相鄰,或者具有不同的比例或?qū)R方式,則新切片可能與其他切片重疊。
要將所有切片的大小調(diào)整到畫板邊界,請選擇“對象”>“切片”>“剪切到畫板”。超出畫板邊界的切片會被截斷以適合畫板大小,畫板內(nèi)部的自動切片會擴展到畫板邊界;所有圖稿保持原樣。
刪除切片
可以通過從對應(yīng)圖稿刪除切片或釋放切片來移去這些切片。
若要刪除切片,請選擇該切片,并單擊“刪除”。如果切片是使用“對象”>“切片”>“建立”命令創(chuàng)建的,則會同時刪除相應(yīng)的圖稿。如果要保留對應(yīng)的圖稿,請釋放切片而不要刪除切片。
要刪除所有切片,請選擇“對象”>“切片”>“全部刪除”。將釋放使用“對象”>“切片”>“建立”命令創(chuàng)建的切片,而不是將其刪除。
要釋放某個切片,請選擇該切片,然后選擇“對象”>“切片”>“釋放”。
顯示或隱藏切片
要在插圖窗口中隱藏切片,請選擇“視圖”>“隱藏切片”。
要在存儲為 Web 和設(shè)備所用格式對話框中隱藏切片,請單擊“切換切片可視性”按鈕 。
要想隱藏切片編號并更改切片線條顏色,請選擇“編輯”>“首選項”>“智能參考線和切片”(Windows) 或“Illustrator”>“首選項”>“智能參考線和切片”(Mac OS)。
創(chuàng)建圖像映射
圖像映射使您能夠?qū)D像的一個或多個區(qū)域(稱為熱區(qū))鏈接到一個 URL。用戶單擊熱區(qū)時,Web 瀏覽器會載入所鏈接的文件。
使用圖像映射與使用切片創(chuàng)建鏈接的主要區(qū)別,在于圖稿導(dǎo)出為網(wǎng)頁的方式。使用圖像映射時,圖稿作為單個圖像文件保持原樣;而使用切片時,圖稿被劃分為多個單獨的文件。圖像映射與切片之間的另一個區(qū)別是,圖像映射使您能夠鏈接圖像的多邊形或矩形區(qū)域,而切片只能鏈接矩形區(qū)域。如果只需要鏈接矩形區(qū)域,使用切片可能比使用圖像映射更可取。
注意:為避免出現(xiàn)意外結(jié)果,不要在包含 URL 鏈接的切片中創(chuàng)建圖像映射熱區(qū) – 否則,在某些瀏覽器中,可能會忽略圖像映射鏈接或切片鏈接。
選擇要鏈接到 URL 的對象。
在“屬性”面板中,從“圖像映射”菜單中選擇圖像映射的形狀。
在 URL 文本框中輸入一個相關(guān)或完整的 URL,或者從可用 URL 列表中選擇。可以通過單擊“瀏覽器”按鈕來驗證 URL 位置。
注意:要在 URL 菜單中增加可見項的數(shù)量,請從“屬性”面板菜單中選擇“面板選項”。輸入一個介于 1 和 30 之間的值,以定義要在 URL 列表中顯示的 URL 項數(shù)。
更多此類內(nèi)容
收集資源并批量導(dǎo)出
創(chuàng)建 Web 圖形的最佳做法
以上就是如何使用 Illustrator 中的切片和圖像映射?ai切片工具怎么用的詳細內(nèi)容,更多關(guān)于Illustrator下載的資料請關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
- 這篇文章主要介紹了在 Illustrator 中使用顏色管理進行打印的相關(guān)資料,需要的朋友可以參考下,保留 RGB 顏色值(適用于 RGB 輸出)或保留 CMYK 顏色值(適用于 CMYK 輸出)2021-12-27
如何在 Illustrator 中添加印刷標記和出血?ai印刷出血線怎么做
這篇文章主要介紹了如何在 Illustrator 中添加印刷標記和出血?ai印刷出血線怎么做的相關(guān)資料,需要的朋友可以參考下,如果出血的用途是確保圖像適合準線,則不應(yīng)超過 2 或2021-12-27- 這篇文章主要介紹了如何在 Illustrator 中更改頁面大小和方向的相關(guān)資料,需要的朋友可以參考下,但可以把介質(zhì)尺寸改為 PPD 文件中所列的任一尺寸,并且可指定縱向(垂直)2021-12-27
在 Illustrator 中如何指定用于裁切或?qū)R的裁剪標記
這篇文章主要介紹了在 Illustrator 中如何指定用于裁切或?qū)R的裁剪標記的相關(guān)資料,需要的朋友可以參考下,借助這款行業(yè)標準的矢量圖形軟件,您可以制作適用于印刷、Web、2021-12-27在 Illustrator 中打印漸變、網(wǎng)格和顏色混合
這篇文章主要介紹了在 Illustrator 中打印漸變、網(wǎng)格和顏色混合的相關(guān)資料,需要的朋友可以參考下,您可以制作適用于印刷、Web、視頻和移動設(shè)備的徽標、圖標、繪圖、版式和2021-12-27在 Illustrator 中通過模板和變量合并數(shù)據(jù)以創(chuàng)建數(shù)據(jù)驅(qū)動圖形
這篇文章主要介紹了在 Illustrator 中通過模板和變量合并數(shù)據(jù)以創(chuàng)建數(shù)據(jù)驅(qū)動圖形的相關(guān)資料,需要的朋友可以參考下,在 Illustrator 中,使用“變量”面板,可通過將數(shù)據(jù)源文2021-12-27- 這篇文章主要介紹了在 Illustrator 中使用封套扭曲或改變形狀的相關(guān)資料,需要的朋友可以參考下,或使用預(yù)設(shè)的變形形狀或網(wǎng)絡(luò)作為封套。除圖表、參考線或鏈接對象以外,您可2021-12-27
如何在 Illustrator 中存儲圖稿?AI圖稿存儲五大基本格式
這篇文章主要介紹了如何在 Illustrator 中存儲圖稿?AI圖稿存儲五大基本格式的相關(guān)資料,需要的朋友可以參考下,因為如果您在 Illustrator 中重新打開文件,Illustrator 將2021-12-25如何在 Illustrator 中導(dǎo)入圖稿文件?ai導(dǎo)入的圖片怎么編輯
這篇文章主要介紹了如何在 Illustrator 中導(dǎo)入圖稿文件?ai導(dǎo)入的圖片怎么編輯的相關(guān)資料,需要的朋友可以參考下,Adobe 產(chǎn)品之間的緊密集成和對多種文件格式的支持,使您能2021-12-25如何使用 Illustrator 中的形狀生成器工具創(chuàng)建形狀?ai怎么使用形狀生
這篇文章主要介紹了如何使用 Illustrator 中的形狀生成器工具創(chuàng)建形狀?ai怎么使用形狀生成器工具的相關(guān)資料,需要的朋友可以參考下,請確保僅選擇需要應(yīng)用該工具的路徑。如2021-12-25