wordpress自带评论头像圆角鼠标触碰后旋转效果

wordpress自带评论头像圆角鼠标触碰后旋转效果

2021-11-20 543
VIP免费
下载不了?请联系网站客服提交链接错误!
增值服务:

wordpress自带评论头像圆角鼠标触碰后旋转效果

2021-11-20 wordpress美化 0 543
郑重承诺丨优站网提供安全交易、信息保真!
增值服务:
自动发货
网盘下载
安装指导
环境配置
二次开发
网站建设
¥ 0 (VIP免费升级VIP开通VIP尊享优惠特权
立即下载 升级会员 购买教程 售后支持
详情介绍

看到有人用头像旋转,我上网搜了一下,很多都用了多多评论插件的旋转头像代码搜索了很久,终于找到了wordpress自己的头像旋转css。站内目前使用的新浪sae好像不支持,先分享一下。

wordpress自带评论头像圆角鼠标触碰后旋转效果-优站网
这是代码。把它放在主题css文件里就可以了。

代码如下:

/** 旋转 **/.avatar{float:left;margin-right:8px;padding:1px;border:1px solid #cfd9e1;width:40px;height:40px; /*设置图像的长和宽*/ border-radius: 20px;/*设置图像圆角效果,在这里我直接设置了超过width/2的像素,即为圆形了*/ -webkit-border-radius: 20px;/*圆角效果:兼容webkit浏览器*/ -moz-border-radius:20px; box-shadow: inset 0 -1px 0 #3333sf;/*设置图像阴影效果*/ -webkit-box-shadow: inset 0 -1px 0 #3333sf; -webkit-transition: 0.4s; -webkit-transition: -webkit-transform 0.4s ease-out; transition: transform 0.4s ease-out;/*变化时间设置为0.4秒(变化动作即为下面的图像旋转360度)*/ -moz-transition: -moz-transform 0.4s ease-out; } .avatar:hover{/*设置鼠标悬浮在头像时的CSS样式*/ box-shadow: 0 0 10px #fff; rgba(255,255,255,.6), inset 0 0 20px rgba(255,255,255,1); -webkit-box-shadow: 0 0 10px #fff; rgba(255,255,255,.6), inset 0 0 20px rgba(255,255,255,1); transform: rotateZ(360deg);/*图像旋转360度*/ -webkit-transform: rotateZ(360deg); -moz-transform: rotateZ(360deg); }

 

 

除非注明,否则均为优站网原创文章,转载必须以链接形式标明本文链接

本文链接:https://www.zhanceo.com/20914.html

资源下载此资源仅限注册用户下载,请先
客服QQ:972908224
收藏 (0) 打赏

感谢您的支持,我会继续努力的!

打开微信/支付宝扫一扫,即可进行扫码打赏哦,分享从这里开始,精彩与您同在
点赞 (1)

免责声明   ⚠️ 1. 本站所有资源来源于网络收集,若资源侵犯了您的合法权益,请来信通知我们(Email: 972908224@qq.com),我们会及时删除,给您带来的不便,我们深表歉意!2. 分享目的仅供大家学习和交流,若使用商业用途,请购买正版授权!否则产生的一切后果将由下载用户自行承担!3. 会员不得使用于非法商业用途,不得违反国家法律。否则后果自负!4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!5. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需!6. 因源码具有可复制性,一经购买 ,不得以任何形式退款。7.更多详情请点击查看

优站网 wordpress美化 wordpress自带评论头像圆角鼠标触碰后旋转效果 https://www.zhanceo.com/20914.html

诚乃立身之本、信为道德之基

常见问题
  • 如果付款后没有弹出下载页面,多刷新几下,有问题联系客服!
查看详情
  • 本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。
查看详情

相关文章

评论
暂无评论
联系官方客服

为您解决烦忧 - 24小时在线 专业服务

wordpress自带评论头像圆角鼠标触碰后旋转效果-海报

分享本文封面