装修前得准备好图片 (找设计师提供)
和一个软件 这个软件用来做热区(热区就是用户点击范围)、
第一步:店招设置和背景
第二步:
店招设置
<table width="150" border="0">
<tbody>
<tr>
<td>
<img src="//gdp.alicdn.com/imgextra/i1/2208114207458/O1CN01aOuuuo24xoStaKr1Q_!!2208114207458.jpg" alt="qqq_02.jpg" usemap="#Map7" border="0" />
</td>
</tr>
</tbody>
</table>
第三部:全屏展示
<div style="height:234px;">
<div class="sn-simple-logo" style="padding-bottom:0px;padding-left:0px;padding-right:0px;padding-top:0px;top:auto;left:50%;">
<div class="sn-simple-logo" style="padding-bottom:0px;padding-left:0px;padding-right:0px;padding-top:0px;top:auto;left:-960px;z-index:99;">
<table width="950" border="0">
<tbody>
<tr>
<td>
<img src="//gdp.alicdn.com/imgextra/i1/2208145778627/O1CN01n42I9i2DbDSpbNbsJ_!!2208145778627.jpg" />
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
4重要代码示范
<div style="height:4968px;">
<div class="sn-simple-logo" style="padding-bottom:0px;padding-left:0px;padding-right:0px;padding-top:0px;top:auto;left:50%;">
<div class="sn-simple-logo" style="padding-bottom:0px;padding-left:0px;padding-right:0px;padding-top:0px;top:auto;left:-960px;z-index:99;">
<table width="950" border="0">
<tbody>
<tr>
<td>
<img src="//gdp.alicdn.com/imgextra/i2/2208145778627/O1CN01vKlTb42DbDSoDSLz4_!!2208145778627.jpg" alt="qqq_03.jpg" />
</td>
</tr>
<tr>
<td>
<img src="//gdp.alicdn.com/imgextra/i1/2208145778627/O1CN01C9WsMi2DbDSoriDBk_!!2208145778627.jpg" alt="qqq_04.jpg" usemap="#Map3" border="0" />
</td>
</tr>
<tr>
<td>
<img src="//gdp.alicdn.com/imgextra/i4/2208145778627/O1CN019AcmoY2DbDT1A56ko_!!2208145778627.jpg" alt="qqq_05-22.jpg" usemap="#Map4" border="0" />
</td>
</tr>
<tr>
<td>
<img src="//gdp.alicdn.com/imgextra/i2/2208145778627/O1CN01PgK7fV2DbDSky7IQw_!!2208145778627.jpg" alt="qqq_06.jpg" usemap="#Map5" border="0" />
</td>
</tr>
<tr>
<td>
<img src="//gdp.alicdn.com/imgextra/i3/2208145778627/O1CN017DyhMC2DbDSkZJJIw_!!2208145778627.jpg" usemap="#Map6" border="0" />
</td>
</tr>
<tr>
<td>
<img src="//gdp.alicdn.com/imgextra/i3/2208145778627/O1CN011u5UEm2DbDSlQJgHu_!!2208145778627.jpg" alt="qqq_08.jpg" usemap="#Map8" border="0" />
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<map name="Map3"> <area coords="459,315,945,538" href="//taoquan.taobao.com/coupon/unify_apply.htm?sellerId=2208145778627&activityId=aca4389560f547e2bc37fd1dd130d411&scene=taobao_shop" target="_blank" style="outline:0px;" /> <area coords="972,317,1449,528" href="//taoquan.taobao.com/coupon/unify_apply.htm?sellerId=2208145778627&activityId=394e6a86cc0641ac8f663ada4e1054d6&scene=taobao_shop" target="_blank" style="outline:0px;" /> <area coords="464,547,940,761" href="//taoquan.taobao.com/coupon/unify_apply.htm?sellerId=2208145778627&activityId=7a5fcc0d5a2a49aaa69dacb24aeef1a9&scene=taobao_shop" target="_blank" style="outline:0px;" /> <area coords="975,555,1448,759" href="//taoquan.taobao.com/coupon/unify_apply.htm?sellerId=2208145778627&activityId=422ad45c2f024a6ca45827b579c5a372&scene=taobao_shop" target="_blank" style="outline:0px;" /> </map> <map name="Map4"> <area coords="415,269,1508,766" href="//detail.tmall.com/item.htm?id=619069405028&scene=taobao_shop" target="_blank" style="outline:0px;" /> </map> <map name="Map5"> <area coords="403,21,1520,605" href="//detail.tmall.com/item.htm?spm=a1z10.1-b-s.w5003-22824847757.1.79bb64d1NK1Igr&id=619335138038&scene=taobao_shop" target="_blank" style="outline:0px;" /> </map> <map name="Map6"> <area coords="401,20,1521,599" href="//detail.tmall.com/item.htm?spm=a1z10.1-b-s.w5003-22824847757.4.2c2464d14Rdi5H&id=619336766851&scene=taobao_shop" target="_blank" style="outline:0px;" /> </map> <map name="Map8"> <area coords="424,85,1484,571" href="//detail.tmall.com/item.htm?spm=a1z10.1-b-s.w5003-22824847757.3.2c2464d14Rdi5H&id=619596051287&scene=taobao_shop" target="_blank" style="outline:0px;" /> </map>
div的 高度 是几个图片加起来的高度
热点相关设置
<table width="950" border="0">
<tr>
<td><img src="https://img.alicdn.com/imgextra/i2/2208145778627/O1CN01vKlTb42DbDSoDSLz4_!!2208145778627.jpg" alt="qqq_03.jpg" usemap="#Map1" border="0"/></td>
</tr>
</table>
<map name="Map1">
<area shape="rect" coords="1409,237,1796,504" href="https://detail.tmall.com/item.htm?spm=a1z10.3-b-s.w4011-22822663007.43.4b2f3330KKNVYR&id=619595339285&rn=4a4ae7888233c4d301e28ba23b825aee&abbucket=11" target="_blank" style="outline:0px;" >
</map>