爱马伦旗舰店大小雪花代码，效果比韩都衣舍还炫，给代码

渣渣

首先，有几个问题很关键，我呢，也就只讲解关键之处，对于不是很重要的，我一律不解释，太麻烦了

1、爱马伦旗舰店的雪花代码是分为两个自定义模块做成的  店铺预览链接：爱马伦旗舰店（ctrl+鼠标左键点击那个蓝色的文字就可以到我设计的店铺了）

2、第一个自定义模块呢，我把海报的上半部分在PS里面给切成了四张小图，起初呢，我的目的是保证图片很清楚，因为图片的容量超过了官方的规定，正是由于这样的想法呢，我发挥了下小创意，大、小雪花一起

3、好吧，说到关键之处吧，其实，你们看到的下雪其实只是四个模块，左右两个呢，加上大雪花，中间两个呢，加上小雪花

要是替换图片的话，直接把图片背景给换掉就OK了

4、咱们可以这样理解，把代码想象成PS，海报就像PS的背景，然后我在背景上面添加了雪花代码，按理说呢，本来是加不了链接了，但是，我还是添加了一个透明图层代码，也就是在透明图层上添加链接

5、说到第二个模块吧，怎么说呢，其实第二模块也没有什么难的，我就是让第二个模块向上移动了10px，好吧，我呢，我给你们一个全屏代码，可以任意调节模块的上下移动，解决让大家脑疼的“间隙”问题

接下来，我采用图片+文字让大家更好地了解一下全屏代码还有间隙的一些小问题

好吧，就说间隙的问题吧

接下来，我们就设置第二个边框，如果间隙是10px；那么，top：-10px;  意思就是说呢，你的模块向上移动了10px；

天猫全屏代码：

1. <div style="height:550px;">
   
2.         <div class="sn-simple-logo" style="padding:0px;left:50%;top:auto;">
   
3.                 <div class="sn-simple-logo" style="padding:0px;left:-960px;top:auto;">
   
4.                        
   
5.             <!-- 中间这个区域呢，加上你们用PS切片出来的代码，我写下来的这个文字呢，天猫会自动屏蔽 -->
   
6.             
   
7.                 </div>
   
8.         </div>
   
9. </div>

复制代码

第一个自定义模块代码：

1. <div style="width:1920px;height:740px;">
   
2.         <div class="footer-more-trigger sn-simple-logo" style="width:1920px;height:750px;padding:0px;border:0;left:50%;top:auto;">
   
3.                 <div class="footer-more-trigger sn-simple-logo" style="width:1920px;height:750px;padding:0px;border:0;left:-960px;top:-10px;z-index:2;">
   
4.                         <div style="height:750px;margin-top:0px;" class="youjiandesigntt10-2">
   
5.                                 <div class="youjian_10_2" style="float:left;width:1920px;height:750px;">
   
6.                                         <div class="youjianwuzh01" style="float:left;margin-left:0px;">
   
7.                                                 <div class="J_TWidget" data-widget-config="{"duration":0.1,"activeTriggerCls":"-_--shop-ww-hover","interval":0.1,"effect":"scrollx","activeIndex":1,"navCls":"user-crzysj","contentCls":"user-crzysjii","autoplay":true}" data-widget-type="Carousel" style="float:left;background:url(http://img02.taobaocdn.com/imgextra/i2/1732458957/TB21lPBbpXXXXaXXpXXXXXXXXXX_!!1732458957.jpg) no-repeat;width:465px;height:750px;">
   
8.                                                         <ul class="user-crzysj">
   
9.                                                                 <li class="-_-switchable-trigger-internal534 -_-switchable-trigger-internal997 -_-switchable-trigger-internal234" style="width:465px;height:750px;float:left;">
   
10.                                                                          <embed allownetworking="all" allowscriptaccess="never" flashvars="scene=taobao_shop" height="650" name="flashfirebug_1387778983714" src="http://img2.tbcdn.cn/tfscom/T1svNgFBxdXXXtxVjX.swf" type="application/x-shockwave-flash" width="465" wmode="transparent" style="z-index:1;"> </embed>
    
11.                                                                 </li>
    
12.                                                         </ul>
    
13.                                                 </div>
    
14.                                                 <div class="J_TWidget" data-widget-config="{"duration":0.1,"activeTriggerCls":"-_--shop-ww-hover","interval":0.1,"effect":"scrollx","activeIndex":1,"navCls":"user-crzysj","contentCls":"user-crzysjii","autoplay":true}" data-widget-type="Carousel" style="float:left;background:url(http://img04.taobaocdn.com/imgextra/i4/1732458957/TB2K2vLbpXXXXXLXXXXXXXXXXXX_!!1732458957.jpg) no-repeat;width:500px;height:750px;">
    
15.                                                         <ul class="user-crzysj">
    
16.                                                                 <li class="-_-switchable-trigger-internal534 -_-switchable-trigger-internal997 -_-switchable-trigger-internal234" style="width:500px;height:750px;float:left;">
    
17.                                                                          <embed allownetworking="all" allowscriptaccess="never" flashvars="scene=taobao_shop" height="650" name="flashfirebug_1387778983714" src="http://img1.tbcdn.cn/tfscom/T1lmk2Fk8bXXXtxVjX.swf" type="application/x-shockwave-flash" width="500" wmode="transparent" style="z-index:1;"> </embed>
    
18.                                                                 </li>
    
19.                                                         </ul>
    
20.                                                 </div>
    
21.                                                 <div class="J_TWidget" data-widget-config="{"duration":0.1,"activeTriggerCls":"-_--shop-ww-hover","interval":0.1,"effect":"scrollx","activeIndex":1,"navCls":"user-crzysj","contentCls":"user-crzysjii","autoplay":true}" data-widget-type="Carousel" style="float:left;background:url(http://img02.taobaocdn.com/imgextra/i2/1732458957/TB28wHLbpXXXXXpXXXXXXXXXXXX_!!1732458957.jpg) no-repeat;width:490px;height:750px;">
    
22.                                                         <ul class="user-crzysj">
    
23.                                                                 <li class="-_-switchable-trigger-internal534 -_-switchable-trigger-internal997 -_-switchable-trigger-internal234" style="width:490px;height:750px;float:left;">
    
24.                                                                          <embed allownetworking="all" allowscriptaccess="never" flashvars="scene=taobao_shop" height="650" name="flashfirebug_1387778983714" src="http://img1.tbcdn.cn/tfscom/T1lmk2Fk8bXXXtxVjX.swf" type="application/x-shockwave-flash" width="490" wmode="transparent" style="z-index:1;"> </embed>
    
25.                                                                 </li>
    
26.                                                         </ul>
    
27.                                                 </div>
    
28.                                                 <div class="J_TWidget" data-widget-config="{"duration":0.1,"activeTriggerCls":"-_--shop-ww-hover","interval":0.1,"effect":"scrollx","activeIndex":1,"navCls":"user-crzysj","contentCls":"user-crzysjii","autoplay":true}" data-widget-type="Carousel" style="float:left;background:url(http://img04.taobaocdn.com/imgextra/i4/1732458957/TB214HCbpXXXXX2XpXXXXXXXXXX_!!1732458957.jpg) no-repeat;width:465px;height:750px;">
    
29.                                                         <ul class="user-crzysj">
    
30.                                                                 <li class="-_-switchable-trigger-internal534 -_-switchable-trigger-internal997 -_-switchable-trigger-internal234" style="width:465px;height:750px;float:left;">
    
31.                                                                          <embed allownetworking="all" allowscriptaccess="never" flashvars="scene=taobao_shop" height="650" name="flashfirebug_1387778983714" src="http://img2.tbcdn.cn/tfscom/T1svNgFBxdXXXtxVjX.swf" type="application/x-shockwave-flash" width="465" wmode="transparent" style="z-index:1;"> </embed>
    
32.                                                                 </li>
    
33.                                                         </ul>
    
34.                                                 </div>
    
35.                                         </div>
    
36.                                         <div class="J_TWidget hidden" data-widget-type="Popup" data-widget-config="{ "trigger":".youjianwuzh01", "align":{"node":".youjianwuzh01","offset":[0,0],"points":["tl","tl"]} }">
    
37.                                                  <a target="_blank" href="http://aimalun.tmall.com/search.htm?spm=0.0.0.0.bWbTqI&search=y&orderType=defaultSort&scene=taobao_shop"> <img src="http://img03.taobaocdn.com/imgextra/i3/1732458957/TB28USVbpXXXXatXXXXXXXXXXXX_!!1732458957.png" style="width:1920px;height:740px;" /></a>
    
38.                                         </div>
    
39.                                 </div>
    
40.                         </div>
    
41.                 </div>
    
42.         </div>
    
43. </div>

复制代码

第二个自定义模块代码:

1. <div style="height:490px;">
   
2.         <div class="sn-simple-logo" style="padding:0px;left:50%;top:auto;">
   
3.                 <div class="sn-simple-logo" style="padding:0px;left:-960px;top:-10px;">
   
4.                         <table width="1920" height="550" border="0" cellpadding="0" cellspacing="0">
   
5.                                 <tbody>
   
6.                                         <tr>
   
7.                                                 <td>
   
8.                                                          <img src="http://img04.taobaocdn.com/imgextra/i4/1732458957/TB2ikPDbpXXXXXjXpXXXXXXXXXX_!!1732458957.jpg" width="465" height="550" alt="" style="float:left;" />
   
9.                                                 </td>
   
10.                                                 <td>
    
11.                                                          <a href="http://taoquan.taobao.com/coupon/unify_apply.htm?sellerId=1732458957&activityId=207970344&scene=taobao_shop" target="_blank"><img src="http://img04.taobaocdn.com/imgextra/i4/1732458957/TB2P3zKbpXXXXX8XXXXXXXXXXXX_!!1732458957.jpg" width="252" height="550" alt="" border="0" style="float:left;" /></a>
    
12.                                                 </td>
    
13.                                                 <td>
    
14.                                                          <a href="http://taoquan.taobao.com/coupon/unify_apply.htm?sellerId=1732458957&activityId=208096296&scene=taobao_shop" target="_blank"><img src="http://img02.taobaocdn.com/imgextra/i2/1732458957/TB2sALGbpXXXXbDXXXXXXXXXXXX_!!1732458957.jpg" width="246" height="550" alt="" border="0" style="float:left;" /></a>
    
15.                                                 </td>
    
16.                                                 <td>
    
17.                                                          <a href="http://taoquan.taobao.com/coupon/unify_apply.htm?sellerId=1732458957&activityId=207906358&scene=taobao_shop" target="_blank"><img src="http://img03.taobaocdn.com/imgextra/i3/1732458957/TB2r1rFbpXXXXctXXXXXXXXXXXX_!!1732458957.jpg" width="245" height="550" alt="" border="0" style="float:left;" /></a>
    
18.                                                 </td>
    
19.                                                 <td>
    
20.                                                          <a href="http://taoquan.taobao.com/coupon/unify_apply.htm?sellerId=1732458957&activityId=208128319&scene=taobao_shop" target="_blank"><img src="http://img03.taobaocdn.com/imgextra/i3/1732458957/TB2X4_KbpXXXXXTXXXXXXXXXXXX_!!1732458957.jpg" width="247" height="550" alt="" border="0" style="float:left;" /></a>
    
21.                                                 </td>
    
22.                                                 <td>
    
23.                                                          <img src="http://img03.taobaocdn.com/imgextra/i3/1732458957/TB2YanAbpXXXXbuXpXXXXXXXXXX_!!1732458957.jpg" width="465" height="550" alt="" style="float:left;" />
    
24.                                                 </td>
    
25.                                         </tr>
    
26.                                 </tbody>
    
27.                         </table>
    
28.                 </div>
    
29.         </div>
    
30. </div>

复制代码