［論壇音畫制作入門］第五講：圖片的上傳和代碼編輯
音畫是由底圖、動畫、音樂等三個主要組成部分然后由代碼在網(wǎng)頁中組成的。底圖是音畫最重要的主體，是藝術(shù)表現(xiàn)的根本。動畫是音畫中的活動圖像，是音畫畫龍點睛的組成部分，能增強底圖的藝術(shù)感染力。音樂好比電影中的配音音樂，它拓展了圖片的藝術(shù)表現(xiàn)，進一步增強底圖的藝術(shù)感染力。代碼是把以上的藝術(shù)元素用網(wǎng)頁代碼的形勢組合在網(wǎng)頁中的工具。它控制了以上元素在網(wǎng)頁上的布局位置和大小，使所有的元素成為有序的排列和組合。
以上就是音畫的基本組成，本教程僅講講音畫的合成制作，底圖和動畫的具體制作技術(shù)那是另外的大課程，在此就不講了。
一、切割圖片：為什么要切割圖片呢？因為在論壇上一般不允許上傳過大的圖片，而在音畫中經(jīng)常是寬1000px高數(shù)千像素的圖片，它的容量是比較大的。切割圖片還有一個好處，就是會更容易在短時間內(nèi)部分顯示圖片，以免長時間的顯示白畫面，造成圖片鏈接失效的錯覺。在PS中的操作見下列圖：
二、圖片的上傳：這個過程就可以省略了吧，如果你這個也不會，該挨打。。。。！！三、取得圖片網(wǎng)址：右擊你上傳后帖子中的圖片，選擇“復(fù)制圖片地址”，然后新建一個文本文檔，打開文檔，把網(wǎng)址粘貼上去備用。四、組合圖片的代碼：對于代碼和網(wǎng)頁編輯不是很熟習(xí)的人，做音畫就是拿來主義，以下提供一個模板，因為是5張分割圖，所以我們把這個模板復(fù)制5個，粘貼在后面。<table style="LEFT: -220px; POSITION: relative; TOP: 100px" width="1000" height="表格高度" background="圖片網(wǎng)絡(luò)地址">
<tr>
<td></td>
</tr>
</table><table style="LEFT: -220px; POSITION: relative; TOP: 100px" width="1000" height="表格高度" background="圖片網(wǎng)絡(luò)地址">
<tr>
<td></td>
</tr>
</table><table style="LEFT: -220px; POSITION: relative; TOP: 100px" width="1000" height="表格高度" background="圖片網(wǎng)絡(luò)地址">
<tr>
<td></td>
</tr>
</table><table style="LEFT: -220px; POSITION: relative; TOP: 100px" width="1000" height="表格高度" background="圖片網(wǎng)絡(luò)地址">
<tr>
<td></td>
</tr>
</table><table style="LEFT: -220px; POSITION: relative; TOP: 100px" width="1000" height="表格高度" background="圖片網(wǎng)絡(luò)地址">
<tr>
<td></td>
</tr>
</table>其實，我們要關(guān)注的只有高度和圖片網(wǎng)址這兩個項目，寬度總是1000為好，左移參數(shù)最后調(diào)。暗殤這個圖片總高是2200，所以每個分割圖片為440，把這個參數(shù)和5個圖片的地址分別填入上面模板。得到的代碼如下：<table style="LEFT: -220px; POSITION: relative; TOP: 100px"
width="1000" height="440" background="http://ai.img1001.com/uu_0912_4/xlfcd_15_2_df8bdca95909ddd.jpg">
<tr>
<td> </td>
</tr>
</table>
<table style="LEFT: -220px; POSITION: relative; TOP: 100px" width="1000" height="440" background="http://ai.img1001.com/uu_0912_4/xlfcd_15_2_a4fe79d47ed7ab9.jpg">
<tr>
<td > </td>
</tr>
</table>
<table style="LEFT: -220px; POSITION: relative; TOP: 100px" width="1000" height="440" background="http://ai.img1001.com/uu_0912_4/xlfcd_15_2_16dd62c7e2e2c8a.jpg">
<tr>
<td >
</td>
</tr>
</table>
<table style="LEFT: -220px; POSITION: relative; TOP: 100px" width="1000" height="440" background="http://ai.img1001.com/uu_0912_4/xlfcd_15_2_798bec85931cc0f.jpg">
<tr>
<td > </td>
</tr>
</table>
<table style="LEFT: -220px; POSITION: relative; TOP: 100px" width="1000" height="440" background="http://ai.img1001.com/uu_0912_4/xlfcd_15_2_1badd06ca63e071.jpg">
<tr>
<td > </td>
</tr>
</table>
</td>
</tr>
</table>
<table style="LEFT: -220px; POSITION: relative; TOP: 100px" border="0" cellpadding="0" cellspacing="0" width="1000" height="440" background="http://ai.img1001.com/uu_0912_4/xlfcd_15_2_798bec85931cc0f.jpg">
<tr>
<td > </td>
</tr>
</table>
<table style="LEFT: -220px; POSITION: relative; TOP: 100px" border="0" cellpadding="0" cellspacing="0" width="1000" height="440" background="http://ai.img1001.com/uu_0912_4/xlfcd_15_2_1badd06ca63e071.jpg">
<tr>
<td > </td>
</tr>
</table>
