網(wǎng)頁模版，個人網(wǎng)站建設入門知識(2)

用切片工具切出上面分出的那些區(qū)域，注意切片與切片之間不能相交，也不能有間隙，仔細點調(diào)整好。切片的時候大小不合適可以隨時調(diào)整大小，方法和使用變形工具類似。

<點圖片看大圖>

切片完成之后想調(diào)整還可以用切片選擇工具重新選擇任意切片然后調(diào)整，這句話像不像在念經(jīng)。。。

然后存儲為web所用格式，快捷鍵就不說了，你懂的。格式選擇JPG，尺寸不要動，點存儲，文件名先隨便，格式選僅限圖像，默認設置，所有切片。

<點圖片看大圖>

這里其實有個小支線任務，格式可以選擇HTML和圖像，PS會幫你生成一個網(wǎng)頁，不過那個太LOW了，咱大俠們不屑一顧，嗯，不管你們信不信反正我信了。

保存后打開你存的文件夾，PS有生成一個images文件夾，表改這位夾兄的名字喲，實際上網(wǎng)站保存圖片的文件夾都叫這個名字。打開images文件夾，我們可以看到切好的圖。

然后分別給它們命名，簡單點可以1234，復雜點就是為了SEO和可維護性考慮，命名得語義化，例如LOGO，就命名首頁-頭部-logo，home_top_logo。這樣的話在其他地方用的另外尺寸的logo就不會和這個logo搞混。

命名好后，把images文件夾整個復制到網(wǎng)頁文件所在位置，這點很重要別忘記喲。

然后我們回到DW，在HTML中，有兩種方法插入圖片，先讓我們試試第一種，直接在頁面插入。

看到那個img標簽了嗎，那就是直接插入一張圖片的意思，格式反正你記住就這么寫就行，src后面的引號里的是圖片文件的相對位置，這里的意思就是與網(wǎng)頁文件同級的文件夾images里的1.jpg。相對位置的理解得練習一段時間，不過不難放心。

除了相對位置，還有絕對位置，你百度一張圖片右鍵屬性可以看到地址那里有一長串的網(wǎng)址，把那個復制下來替換掉相對地址就行，不過網(wǎng)站一般沒有用到這個的時候，這個先不深究。