設為首頁加入我的最愛
🌓

 找回密碼
 立即註冊
搜尋
熱門搜尋: 活動 交友 discuz
返回列表 發表文章
點閱: 1380|回覆: 1

Photoshop圖像切片儲存為網頁HTML（DIV+CSS佈局）的方法 [複製連結]

admin

等級：25 - 爐火純青

經驗值：0 / 244

魔法值：13482 / 13482

生命值：4%

升級   100%

  • TA的每日心情
    開心
    4 小時前

    • 簽到天數: 5459 天

    [LV.Master]伴壇終老
    發表於 2016-7-19 21:24:37 |顯示全部樓層

    馬上註冊，結交更多好友，享用更多功能，讓你輕鬆玩轉社群。

    您需要 登入 才可以下載或檢視，沒有帳號？立即註冊

    ×
    首先，製作圖像切片（以一張圖片為例子） 4 T$ d& I" L+ g. @" Z+ Q' @
    一、選擇「切片」工具，在圖像上拖動以分割圖像（例如：一張圖像切割2次就形成3個切片）
    ( ?3 U0 b% u6 V* l

    8 P$ l) D6 e. W7 W8 q9 n( ^* T                               
    登入/註冊後可檢視大圖

    7 @+ ^, r# Q; N5 N, @: b' O切片後如下圖
    9 |! ]2 V/ V( [3 |7 \" J7 e
    ; X: h- _' ]" P7 [# P
                                   
    登入/註冊後可檢視大圖

    1 u2 H/ e2 }  P& y+ K  Q二、設定切片選項（如大小、目標連結、圖片說明等等）：選擇「切片選擇」工具，在要設定的圖像切片上雙擊，在彈出的面板進行具體設定（如圖）： : p) Y1 |/ L, {, T& z
    ' B) Y4 P9 u8 R" f
                                   
    登入/註冊後可檢視大圖
    8 C& k! H' N: e' ]# o: X- {) h
    三、儲存切片為網頁：
    : P. i" B, l) y3 A, q檔案——儲存為WEB和設備所用格式
    . r7 f" e4 Z& c$ [  g) D* r
    6 s/ @. R( |2 H- m
                                   
    登入/註冊後可檢視大圖

    ( n( o! M( r5 h7 K" |3 v' m一般選擇gif圖片格式，圖片邊緣的背景色設定為「無」，點閱「儲存」 " d) c( ?( b; E: }6 U3 Q. t9 U2 z; h

    , d* L6 {) J# C5 l) V4 L                               
    登入/註冊後可檢視大圖

    ! |2 e- {6 S! K) R然後，儲存類型「HTML和圖像」。如果要儲存為DIV+CSS佈局，則設定「其它」 7 p3 T# H, a4 A" c. `8 N$ u/ M
    ' q8 l6 j9 u3 k3 N0 }) g0 l
                                   
    登入/註冊後可檢視大圖
    2 @- i2 H* S9 c! I
    此時會彈出進一步設定面板，選擇「切片」「建立CSS」 5 o2 Z# @; T1 s" w9 r. n
    0 L7 h7 V& u6 S( J# f- \# _
                                   
    登入/註冊後可檢視大圖
    5 ?3 F4 n1 _0 @( o
    這樣，圖像切片就被儲存成DIV+CSS的網頁佈局了。
    Photoshop

    文章的最近訪客

    Photoshop

    使用道具 回報

    lindaren

    等級：12 - 出類拔萃

    經驗值：0 / 112

    魔法值：752 / 4123

    生命值：2%

    升級   62.9%

  • TA的每日心情
    開心
    2021-3-12 09:20

    • 簽到天數: 222 天

    [LV.7]常住居民III
    發表於 2016-7-20 00:34:01 |顯示全部樓層
    不懂                 

    使用道具 回報

    返回列表 發表文章
    進階模式
    B Color Image Link Quote Code Smilies
    您需要登入後才可以回覆文章 登入 | 立即註冊

    本版積分規則

    Archiver|手機版|MyXNova (原 myxnova.com)

    GMT+8， 2024-12-24 04:22 , Processed in 0.013883 second(s), 11 queries , Gzip On.

    Powered by Discuz! X3.5

    © 2001-2014 Comsenz Inc. 界面設計: 我的XNova論壇

    快速回覆 返回頂端 返回列表