请选择 进入手机版 | 继续访问电脑版

【米色】电商淘宝店没有购买CSS权限,实现店铺特效的方法 

2017-11-03 18:29 发布

经验交流 /[电商代码]
121 0 0

83

帖子

22

听众

302

米币

超级版主

Rank: 8Rank: 8

积分
632
米色设计 发表于 2017-11-3 18:29:12 | 显示全部楼层 |阅读模式
友情提示: 如果有任何不懂或者问题要问的, 请在相应的在线求助发表新帖提问, 谢谢合作!!!

在美设网注册账号,查看完整图文信息哦

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
特效.jpg

很多人经常问,淘宝店铺里面如何实现特效?
那我们首先要了解,下面几个问题:
​1-特效是什么?
2-特效实现的原理

一:特效是什么?
在不同领域说法也不一样,电商店铺里面特效指的是CSS特效。一般特指鼠标经过而实现的一些视觉上的特殊效果。比如鼠标经过图片放大等

二:特效实现的原理?
这个其实很简单,既然是鼠标经过而产生变化,那就类似于动画。
动画如何产生的,通过几个不同时间的关键帧,而让人视觉上产生动画的效果。
那么店铺特效也是,如何产生变化,就需要2个状态。
【鼠标经过前】:鼠标没有经过的时候,默认的效果
【鼠标经过后】:鼠标经过后,产生变化的部分。
而CSS里面能产生这种效果的,有很多。其中用的比较多的是,鼠标经过的状态,也就是伪类 :hover

现在知道了特效的原理。那如何在店铺实现呢?
其实我们做的事情,无非就是想方设法让某些样式产生变化。一般方法是下面这些:
1-购买CSS权限
2-破解之写入CSS
3-破解之调用可以写入CSS的模块
4-购买店铺模板
5-调用官方样式实现

这里我只是说说最后一种。调用的方法,我自己对它也分好几个境界。
1-简单的调用 ---- 筑基期
2-嵌套的调用 ---- 婴变期
3-大神级操作 ---- 大天尊

一:简单调用
顾名思义就是简单的直接调用官方带 :hover 的样式实现。这里给大家提供几个,自己去试试
  1. <font face="微软雅黑"><style>
  2. .tmsg_app:hover { background: #F7F7F7;}
  3. .cloud-spu-list .cloud-total .more:hover { color: #f60;}
  4. .pagination a:hover {color: #fff;background-color: #09f;}
  5. </style>
  6. <!--其实我自己的淘宝店里面,以前就已经展示了很多,如果想知道我店铺地址,可以留言-->
  7. <div style="height:100px;float:left;width:200px;border:none;height:auto;" class="tmsg_app">NO1:tmsg_app </div>
  8.   
  9. <div style="height:100px;float:left;background:none;display:block;border:none;width:200px;" class="cloud-spu-list">
  10.   <div class="cloud-total">
  11.     <div class="more"> NO2:more </div>
  12.   </div>
  13. </div>
  14.   
  15. <div class="pagination" style="float:left;"> <a> NO3:pagination </a> </div></font>
复制代码

需要注意的是,官方样式,因为我们是调用,说明这些样式默认是存在其他样式的,而这些其他样式我们是不需要的,导致测试的时候 效果不理想。所以我们需要把不需要的样式覆盖掉或者修改成你想要的效果

二:嵌套的调用
顾名思义,就是不单单直接调用,而是灵活的将不同的官方样式,融合在一起 从而实现一些更炫酷的效果

三:大神的操作
官方没有带 :hover 的铍铜样式,如何来实现特效,也就是化腐朽为神奇,所以叫大神级操作
这里不做过多介绍,关注米色公众号,以后有机会 可能会分享这个方法。

店铺特效,很多人会说,现在手机端更重要。不可否认是这样。那是不是手机端更重要就不需要代码了呢?答案是否定的
1-手机端会不会永远都是直接添加图片和链接呢?肯定不会,因为人的审美会变化,或许以后,人们对手机端的效果要求更高了呢,电商平台允许我们事先代码做效果。就像当初时电脑端也只是图片加文字,而现在各种炫酷网页特效。凡事不能看眼前,应该看长远点
2-代码不仅仅是装修店铺,还可以做很多事情,做很多工作,这里就不多说了。以前发帖说过这个问题。

最后一句话,凡事不能只想着,现在不需要 就不在乎。防患于未然,也许现在不需要,但是将来很需要呢?

公众号二维码.jpg
扫码关注米色公众号(miser1314)

回复

使用道具 举报

B Color Smilies
联系
我们
快速回复 返回顶部 返回列表