全屏效果:
width:1920px;height:1332px 图片尺寸的宽和高
background:url(图片地址) 图片空间图片链接
gif带有下雪效果的gif图,后面href 指定跳转点击的链接 可空 #
C店天猫区别类似,尺寸大小改变
---------------------以下贴出天猫和淘宝基础版本代码--------------
C店智能版
<div style="height:1312px"> <div class="TWidgstt21290aigye footer-more-trigger sn-simple-logo most-footer mgzxzs_qpdm" style="z-index: 1;width:1920px;height:1332px;padding:0;left:50%;top:auto;border:0px solid red;background:none;"> <div class="TWidgstt21290aigye footer-more-trigger sn-simple-logo most-footer" style="width:1920px;height:1332px;padding:0;left:-50%;top:-0px;border:0px solid red;background:none;overflow:hidden;"> <div style="width:1920px;margin:0 auto;background: url() no-repeat top center fixed;"> <li style="width:1920px;height:1332px;display:block;background:url(https://img.alicdn.com/imgextra/i1/3400276084/TB2LAQoX_nI8KJjSszgXXc8ApXa_!!3400276084.jpg);"> <a style="display: block;background:url(https://img.alicdn.com/imgextra/i2/456989075/TB2WcD9iFXXXXcfXpXXXXXXXXXX-456989075.gif);" href="https://shop453030768.taobao.com/search.htm?spm=2013.1.w5001-17072904642.3.5f1f4e1b0AGDVk&search=y&orderType=hotsell_desc&scene=taobao_shop" target="_blank"> <img width="100%" height="100%" src="https://assets.alicdn.com/s.gif" /></a></li></div> </div> </div> </div>
天猫版本
<div style="height:1312px"> <div " class="TWidgstt21290aigye footer-more-trigger sn-simple-logo most-footer mgzxzs_qpdm" style="z-index: 1;width:1920px;height:1332px;padding:0;left:50%;top:auto;border:0px solid red;background:none;"> <div class="TWidgstt21290aigye footer-more-trigger sn-simple-logo most-footer" style="width:1920px;height:1332px;padding:0;left:-50%;top:-0px;border:0px solid red;background:none;overflow:hidden;"> <div style="width:1920px;margin:0 auto;background: url() no-repeat top center fixed;"><li style="width:1920px;height:1332px;display:block;background:url(https://img.alicdn.com/imgextra/i1/3400276084/TB2LAQoX_nI8KJjSszgXXc8ApXa_!!3400276084.jpg);"><a style="display: block;background:url(https://img.alicdn.com/imgextra/i2/456989075/TB2WcD9iFXXXXcfXpXXXXXXXXXX-456989075.gif);" href="https://shop453030768.taobao.com/search.htm?spm=2013.1.w5001-17072904642.3.5f1f4e1b0AGDVk&search=y&orderType=hotsell_desc&scene=taobao_shop" target="_blank"><img width="100%" height="100%" src="https://assets.alicdn.com/s.gif" /></a></li></div> </div> </div> </div>
c点基础版代码
<div style="height:1312px"> <div class="TWidgstt21290aigye footer-more-trigger sn-simple-logo most-footer mgzxzs_qpdm" style="z-index: 1;width:1920px;height:1332px;padding:0;left:50%;top:auto;border:0px solid red;background:none;"> <div class="TWidgstt21290aigye footer-more-trigger sn-simple-logo most-footer" style="width:1920px;height:1332px;padding:0;left:-1060px;top:-0px;border:0px solid red;background:none;overflow:hidden;"> <div style="width:1920px;margin:0 auto;background: url() no-repeat top center fixed;"><li style="width:1920px;height:1332px;display:block;background:url(https://img.alicdn.com/imgextra/i1/3400276084/TB2LAQoX_nI8KJjSszgXXc8ApXa_!!3400276084.jpg);"><a style="display: block;background:url(https://img.alicdn.com/imgextra/i2/456989075/TB2WcD9iFXXXXcfXpXXXXXXXXXX-456989075.gif);" href="https://shop453030768.taobao.com/search.htm?spm=2013.1.w5001-17072904642.3.5f1f4e1b0AGDVk&search=y&orderType=hotsell_desc&scene=taobao_shop" target="_blank"><img width="100%" height="100%" src="https://assets.alicdn.com/s.gif" /></a></li></div> </div> </div> </div>
其它效果代码
稀小雪花代码
<a style="display: block;background:url(https://img.alicdn.com/imgextra/i3/456989075/TB2JwyrchBmpuFjSZFDXXXD8pXa-456989075.gif);" href="https://shop453030768.taobao.com/search.htm?spm=2013.1.w5001-17072904642.3.5f1f4e1b0AGDVk&search=y&orderType=hotsell_desc&scene=taobao_shop" target="_blank"><img width="100%" height="100%" src="https://assets.alicdn.com/s.gif" /></a></li></div> </div> </div> </div>
下雪效果
<a style="display: block;background:url(https://img.alicdn.com/imgextra/i2/456989075/TB27tQxiFXXXXaDXXXXXXXXXXXX-456989075.gif);" href="https://shop453030768.taobao.com/search.htm?spm=2013.1.w5001-17072904642.3.5f1f4e1b0AGDVk&search=y&orderType=hotsell_desc&scene=taobao_shop" target="_blank"><img width="100%" height="100%" src="https://assets.alicdn.com/s.gif" /></a></li></div> </div> </div> </div>
闪烁效果
<a style="display: block;background:url(https://img.alicdn.com/imgextra/i4/456989075/TB2cNQDiFXXXXatXXXXXXXXXXXX-456989075.gif);" href="https://shop453030768.taobao.com/search.htm?spm=2013.1.w5001-17072904642.3.5f1f4e1b0AGDVk&search=y&orderType=hotsell_desc&scene=taobao_shop" target="_blank"><img width="100%" height="100%" src="https://assets.alicdn.com/s.gif" /></a></li></div> </div> </div> </div>
闪烁十字星效果
<a style="display: block;background:url(https://img.alicdn.com/imgextra/i1/456989075/TB26l.miFXXXXXRXpXXXXXXXXXX-456989075.gif);" href="https://shop453030768.taobao.com/search.htm?spm=2013.1.w5001-17072904642.3.5f1f4e1b0AGDVk&search=y&orderType=hotsell_desc&scene=taobao_shop" target="_blank"><img width="100%" height="100%" src="https://assets.alicdn.com/s.gif" /></a></li></div> </div> </div> </div>
枫叶效果
<a style="display: block;background:url(https://img.alicdn.com/imgextra/i3/456989075/TB2yDcKiFXXXXXIXXXXXXXXXXXX-456989075.gif);" href="https://shop453030768.taobao.com/search.htm?spm=2013.1.w5001-17072904642.3.5f1f4e1b0AGDVk&search=y&orderType=hotsell_desc&scene=taobao_shop" target="_blank"><img width="100%" height="100%" src="https://assets.alicdn.com/s.gif" /></a></li></div> </div> </div> </div>
上浮水泡效果
<a style="display: block;background:url(https://img.alicdn.com/imgextra/i2/456989075/TB21joFiFXXXXaUXXXXXXXXXXXX-456989075.gif);" href="https://shop453030768.taobao.com/search.htm?spm=2013.1.w5001-17072904642.3.5f1f4e1b0AGDVk&search=y&orderType=hotsell_desc&scene=taobao_shop" target="_blank"><img width="100%" height="100%" src="https://assets.alicdn.com/s.gif" /></a></li></div> </div> </div> </div>
花瓣飘落效果
<a style="display: block;background:url(https://img.alicdn.com/imgextra/i2/456989075/TB2HeIfiFXXXXbOXpXXXXXXXXXX-456989075.gif);" href="https://shop453030768.taobao.com/search.htm?spm=2013.1.w5001-17072904642.3.5f1f4e1b0AGDVk&search=y&orderType=hotsell_desc&scene=taobao_shop" target="_blank"><img width="100%" height="100%" src="https://assets.alicdn.com/s.gif" /></a></li></div> </div> </div> </div>
七彩流星效果
<a style="display: block;background:url(https://img.alicdn.com/imgextra/i2/456989075/TB2_DQhiFXXXXbAXpXXXXXXXXXX-456989075.gif);" href="https://shop453030768.taobao.com/search.htm?spm=2013.1.w5001-17072904642.3.5f1f4e1b0AGDVk&search=y&orderType=hotsell_desc&scene=taobao_shop" target="_blank"><img width="100%" height="100%" src="https://assets.alicdn.com/s.gif" /></a></li></div> </div> </div> </div>
下雨效果
<a style="display: block;background:url(https://img.alicdn.com/imgextra/i4/456989075/TB2OeQoiFXXXXalXpXXXXXXXXXX-456989075.gif);" href="https://shop453030768.taobao.com/search.htm?spm=2013.1.w5001-17072904642.3.5f1f4e1b0AGDVk&search=y&orderType=hotsell_desc&scene=taobao_shop" target="_blank"><img width="100%" height="100%" src="https://assets.alicdn.com/s.gif" /></a></li></div> </div> </div> </div>
其它自定义效果:
格式动态飘零效果图替换源代码内容