很多精美的網頁都是用photoshop制作,并生成網頁的,下面我們來介紹一下怎樣使用ps來生成網頁,也很適用于圖文快印店的工作人員哦。
1. 先打開photoshop設計好你的網頁背景,如圖所示,如何設計這樣的頁面我就不講了,不屬于該經驗的內容,下面就是要介紹如何將這樣的圖片轉換問網頁。
2.在工具欄選擇【切片工具】,大部分人的工具欄只顯示裁剪工具,右鍵單擊裁剪工具就能看到切換工具,選擇它即可。
3.屬性欄進行設置,先來設置樣式,有三種樣式可供選擇,正常樣式、固定長寬比、固定大小。
4.正常模式下,鼠標拖動可以繪制一個矩形的切片,切片的大小和長寬比都是任意的,點擊切片就會使切片的邊框變成棕褐色(如下面第二幅圖),并出現八個控制點(如下面第三幅圖,拖動控制袋可以任意的改變切片的大小),另外,直接拖動切片也可以改變切片的位置。
5.固定長寬比模式下,拖動鼠標可以繪制切片,切片的大小是任意的,但是切片的長寬比是固定不變的。為了方便,一般長寬比和圖像的的長寬比是相同的。怎樣知道圖像的長寬比呢,參考下面第二幅圖,在圖像--圖像大小下,打開圖像大小對話框,這里你可以找到圖像的寬度和高度。
6.固定大小模式下,切片的長和寬都是你設定的,不會改變,如圖所示,點擊一下鼠標就可以繪制一個切片,我繪制的這些切片都是一樣大小的。選中一個切片,切片變成棕色的邊框,并出現了八個控制點,拖動控制點也可以改變切片的大小。
7.一般將圖片切割成網頁的時候,我們可以使用一種簡便的方法,切換到任意一種模式下,右鍵單擊圖像,然后在打開的右鍵菜單中,選擇【劃分切片】,打開劃分切片的對話框。
8.設置將圖片切分為水平4個切片,垂直5個切片,點擊確定按鈕,下面第二幅圖就是我們建立這個切片。這是建立切片最快的速度了。
9.拖動控制點可以改變整行或者整列的寬度和高度。
10.除此之外,我們還可以對某個切片進行進一步的切割,右鍵單擊某個切片,然后選擇【劃分切片】,打開劃分切片對話框,設置橫向和縱向的切片個數,如圖所示
11.最后,一個關鍵的設置就是,右鍵單擊某個切片,然后在打開的右鍵菜單中選擇【編輯切片選項】,打開切片選項對話框。
12.在這里你要設置的有切片的名稱,這個名稱也就是網頁圖片的名稱,默認系統給出的名稱即可。設置url,也就是圖片的鏈接,在網頁上點擊圖片就能打開這個鏈接;目標在動態圖片中需要設置,即加載url時的楨,在靜態的圖片中不需要設置;信息文本也就是鼠表放在網頁上的圖片上的時候,出現在瀏覽器底部狀態欄的文字信息;alt標記就是鼠標放在圖片上,自動出現在圖片周圍的文字。設置好這些參數以后點擊確定按鈕。
13.最后就是要保存html文件了,在菜單欄上執行:文件--存儲為web和設備所用格式
14.在打開的對話框中,點擊【雙聯】你會看到兩個圖片,上面這個是處理前的原圖,下面這個是處理后的圖片,你可以對比兩個效果以后再保存圖片。
15.設置格式為jpeg,其他參數參考下面的這幅圖,一般默認系統給出的參數即可。點擊儲存按鈕。
16.最關鍵的步驟就是在這里,設置格式為【html和圖像】,然后點擊保存按鈕。
17.你會看到保存后有兩個文件,一個是圖片文件夾,一個是html文件,雙擊打開html就可以看到一個網頁了。
18用dreamweaver打開網頁文件可以對齊進行進一步的編輯。
新紙品不斷涌現 新聞紙國內市場供大于求印刷中的樣本印刷指的是什么?國內唯一臺掛歷展遇冷 臺掛歷會否成為“老皇歷”?綠色印刷的起源揭秘自動包裝生產過程中常見六大問題印前軟件How to 問答數碼印刷將給傳統膠印帶來顛覆性的改變企業管理軟件的價值、選型與實施