很多的賣家在逛淘寶店時(shí)會(huì)發(fā)現(xiàn)很多的店鋪裝修很美觀，如打折模塊和團(tuán)購(gòu)模塊，現(xiàn)在就跟大家分享一下：
　　
　　【準(zhǔn)備工作】：DW CS5版本、PS CS5版本（DW全稱Dreamweaver，PS全稱Photo Shop，CS5為軟件的版本，不同的版本所擁有的的功能也不同，建議學(xué)習(xí)本帖的同學(xué)還是下載相同版本的軟件，如果您遇到問(wèn)題，我才能很好的幫您解決）、紙筆等。
　　
　　【第一步：前期籌劃】：在制作表格促銷模塊時(shí)，我們得先考慮好表格的大小，以用來(lái)鏈接大小合適的圖片，所以此時(shí)【紙筆】必不可少。首先，通欄的尺寸為950，所以表格的寬度定為950，具體的高度還是按照您自己要設(shè)置的大小來(lái)確定。我選擇的表格大小是950*580，具體表格分布為5行7列。先弄出一個(gè)大概圖給大家看看：

　　圖中的白色部位占據(jù)一行或一列，彩色模塊為圖像占位符，用來(lái)鏈接圖片的。
　　
　　【第二步：打開(kāi)DW設(shè)計(jì)軟件】：新建一個(gè)HTML頁(yè)面，快捷鍵為Ctrl+N，如圖

　　布局選擇【無(wú)】，點(diǎn)擊右下角的【創(chuàng)建】，這樣一個(gè)html頁(yè)面就新建成功了。

　　因?yàn)槭莿偨ê茫瑳](méi)有添加任何的內(nèi)容，所以此時(shí)的操作界面是白色的，如上圖。
　　
　　接著，我們點(diǎn)擊【插入】菜單，這是可以看到【表格】項(xiàng)目，點(diǎn)擊，在表格中輸入【5行，7列，表格寬度950，邊框粗細(xì)0，單元格邊框、間距0，標(biāo)題選擇“無(wú)”】，如下圖

　　這樣，一個(gè)5行7列的表格就只做而成了，大家先看看效果圖

　　自動(dòng)生成的表格是不居中的，所以選擇右下角的【對(duì)齊：居中對(duì)齊】，這樣表格就會(huì)呈現(xiàn)在頁(yè)面的中央。大家這時(shí)是不是還覺(jué)得表格這么小，怎樣將圖片插入進(jìn)去啊？呵呵，酸儒先傻笑一下……這樣當(dāng)然不能直接插圖啊，首先要確定好各個(gè)單元格的大小，然后再將相應(yīng)的圖片插入，大家注意力集中啦，往下看：
　　
　　在前面的大概圖中，我已經(jīng)標(biāo)出了相應(yīng)單元格大小了，左邊的小方塊為240*260的像素大小，右邊的長(zhǎng)方形為390*540的像素大小，其余白色部分的寬度或高度都是20px，這個(gè)只是教程中的大小，具體數(shù)據(jù)大小各位賣家可以自己設(shè)置的。切勿照葫蘆畫(huà)瓢，更多的還是需要自己多揣摩！！！
　　
　　又有人會(huì)問(wèn)，單元格的大小設(shè)置到底該怎么設(shè)置呢？各位親，請(qǐng)別急，酸儒我先去喝口水！
　　
　　首先，將鼠標(biāo)定位在一個(gè)單元格中，此時(shí)在下面的【屬性】欄中，會(huì)出現(xiàn)相應(yīng)的屬性，我先示范左邊方格大小的設(shè)置，其他的設(shè)置雷同。

　　在下面的【屬性】欄中輸入【寬：240】、【高：260】，呈現(xiàn)出的效果如上圖紅色部分（紅色是因?yàn)槲以凇颈尘邦伾恐羞x擇了顏色，方便大家查看區(qū)別，并無(wú)實(shí)際用處）。
　　
　　按照，我的方法，將所有的表格大小確定好后，接著要做的工作就是將相應(yīng)的促銷圖片放入表格中。這時(shí)先不著急插入圖片，而是先插入一個(gè)【圖像占位符】，主要是為了大家以后可以再次利用這個(gè)模塊。
　　
　　大家，還是先看到左上角的菜單欄【插入】，點(diǎn)擊，選擇【圖像對(duì)象】→【圖像占位符】，點(diǎn)擊鼠標(biāo)，出現(xiàn)如圖對(duì)話框

　　在【寬度】、【高度】中輸入相應(yīng)的尺寸大小，接著在【顏色】項(xiàng)目中添加上顏色，這個(gè)步驟的主要作用是為了區(qū)分各個(gè)單元格的圖像占位符，如此一個(gè)圖像占位符就做成了。

　　接下來(lái)，將各個(gè)需要插入圖像的單元格插入相應(yīng)大小的圖像占位符，寫(xiě)入您的促銷廣告，一個(gè)表格的促銷模塊就做好了。
　　
　　有時(shí)候，你要制作的表格模塊，邊框是沒(méi)有顏色的，選擇的底色又是白色，沒(méi)法區(qū)分開(kāi)背景，此時(shí)你只需在【頁(yè)面屬性】中選擇【背景顏色】，此時(shí)制作出來(lái)的表格就很刺眼了，看出了整體的布局。什么？？不信？？那你還是試試吧……

　　我選擇的是黑色，大家看看表格的輪廓是不是鮮明多了！
　　
　　哇咔咔！別太高興了，圖片還沒(méi)教會(huì)大家怎么插入呢！往下看……
　　
　　在剛做好的表格中，點(diǎn)擊任意一個(gè)【圖像占位符】，下面的【屬性】欄中會(huì)出現(xiàn)相應(yīng)的屬性，在【源文件】一項(xiàng)中填入促銷寶貝的圖片，【鏈接】出填上相應(yīng)的寶貝詳情地址，【目標(biāo)】處選擇“_blank”，這個(gè)選項(xiàng)的作用是使被鏈接的寶貝能在新的窗口打開(kāi)。

　　最后，插入事先做好的圖片，最終的效果就出來(lái)了！

　　看看，表格的魅力就是這么大，想怎么變就怎么變！

樂(lè)發(fā)網(wǎng)超市批發(fā)網(wǎng)提供超市貨源信息,超市采購(gòu)進(jìn)貨渠道。超市進(jìn)貨網(wǎng)提供成都食品批發(fā),日用百貨批發(fā)信息、微信淘寶網(wǎng)店超市采購(gòu)信息和超市加盟信息.打造國(guó)內(nèi)超市采購(gòu)商與批發(fā)市場(chǎng)供應(yīng)廠商搭建網(wǎng)上批發(fā)市場(chǎng)平臺(tái),是全國(guó)批發(fā)市場(chǎng)行業(yè)中電子商務(wù)權(quán)威性網(wǎng)站。

本文內(nèi)容整合網(wǎng)站：百度百科、知乎、淘寶平臺(tái)規(guī)則

本文來(lái)源： 打折團(tuán)購(gòu)模塊裝修視覺(jué)體驗(yàn)