帮助中心
40
最新文章
  • 预防采集建议屏蔽WordPress RSS订阅Feed接口
  • wordpress访问报错“建立数据库连接时出错”的问题思考与解决方案
  • wordpress如何利用404 Notifier插件实现404页面邮件通知站长邮箱
  • wordpress源码程序在发表评论时如何在不使用插件的情况下插入图片
  • wordpress博客源码程序如何使用插件实现旧文章随机更新为新文章来展示
  • wordpress福利篇之非常漂亮的英文企业主题展现
  • 如何在wordpress后台仪表盘添加控制台widget功能
  • wordpress在不使用插件的情况下实现每篇文章底部加入站点版权
  • wordpress技巧篇之怎么使每篇文章针对百度蜘蛛做出检测而快速得到文章的收录情况
  • WordPress如何解决php程序报错Warning Creating default object from empty value in…
  • 文章分类
  • 171CMS_711CMS
  • BIWEB商务智能网站系统
  • BO-BLOG开源博客系统相关
  • cmseasy易通企业系统相关
  • Cscms程氏内容管理系统
  • dedecms教程_织梦系统帮助文档_dedecms虚拟主机空间
  • Destoon开源b2b系统相关
  • DirectAdmin(DA)用户面板相关
  • discuz论坛_discuz x3.0教程_discuz x3.2教程_DZ论坛
  • DouPHP轻量级企业网站管理系统
  • drupal开源内容管理系统(CMS)
  • ecmall商城系统教程-ecmall最新版本-ecmall模版教程
  • Ecshop开源网店系统相关
  • ECTouch程序相关教程
  • ESPCMS_易思
  • ftp教程_ftp上传工具_ftp软件_ftp是什么
  • iwebshop开源网店系统相关
  • joomla开源cms相关
  • KingCMS内容管理系统
  • Lifetype开源博客相关
  • Magento开源电子商务系统
  • mambors开源cms相关
  • mediawiki开源百科系统相关
  • Metinfo(米拓)CMS教程-米拓模版安装教程
  • modoer3.2_modoer点评系统_modoer模版
  • MvMmall多用户商城系统
  • mysql数据库相关
  • opensns开源社交系统
  • oscommerce电子商务系统
  • PHPBB开源论坛程序相关
  • phpcms教程_phpcms漏洞修复_phpcms技术中心
  • phpmyfaq开源问答(FAQ)系统相关
  • phpweb程序_phpweb教程_phpweb成品网站
  • PHPWIND开源论坛系统相关
  • phpyun
  • php主机产品
  • Pmwiki开源百科程序
  • SemCms开源程序
  • ShopEx网店程序_shopex模板教程_shopex虚拟主机空间
  • ShopNc开源商城系统教程_电子商务系统教程
  • Thinkphp中文WEB应用开发框架相关
  • thinksns全平台综合型社交系统
  • Typecho开源博客系统相关
  • WordPress博客中文教程_wordpress模板教程_wordpress虚拟主机空间
  • XOOPS内容管理系统(CMS)
  • YOUDIANCMS内容管理系统
  • zblog博客程序教程_zblog模版问题解决方法
  • Zen Cart开源商城系统相关
  • 主机环境配置相关
  • 其他资料
  • 域名相关
  • 安全资讯
  • 宏博cms企业系统相关
  • 帝国CMS教程_帝国CMS常见问题解决方法
  • 建站之星教程_建站之星程序常见问题解决方案
  • 无忧主机原创视频教程
  • 无忧主机用户部署安装网站
  • 无忧主机超级用户管理系统相关
  • 易企cms企业系统相关
  • 最土团购程序_最土团购程序模板教程_最土团购虚拟主机空间
  • 海盗云商系统
  • 网站SEO教程_SEO是什么?_SEO博客-无忧主机
  • 网站迁移和数据备份相关
  • 资源目录
  • 骑士cms_骑士人才系统教程
  • 实现WordPress评论中用户头像旋转功能的方法介绍

    无忧小编今天在逛wordpress大学的时候发现了一个很好玩的功能,在查看用户对文章评论时,鼠标放在用户头像上会自己旋转,小编觉得这是给网站美化加分的一个很好的方法,对在无忧主机php空间上运行的wordpress会很有帮助。如下是无忧小编在wordpress大学截的旋转头像功能。

    wp 11 8 8 287x300 实现Wordpress评论中用户头像旋转功能的方法介绍

    看此功能好玩于是无忧小编亲自测试,然后用最简单的表达方法介绍给大家,废话不多说了下面跟着无忧小编一步步的操作!
    第一步:用FTP或者其他工具进入根目录(无忧主机根目录是:public html)wp-content—themes—找到当前使用主题—找到style.css文件下载到本地后用代码编辑器打开,把如下的代码添加到39行下面也就是最后一行了!

    .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); }

    给大家一个详细添加代码的截图如下:

    wp 11 8 9 300x121 实现Wordpress评论中用户头像旋转功能的方法介绍

    添加好了之后就几乎大功告成了!进入文章查看用户评论头像把鼠标放上去试试看就OK 了!如下图是无忧小编自己亲自测试的截图,或者进入无忧小编的网站http://www.kimballli.com/?p=235查看:

    wp 11 8 10 300x215 实现Wordpress评论中用户头像旋转功能的方法介绍

    以上是无忧小编对wordpress旋转用户评论头像方法,如果大家有新的方法或者意见的话可以直接联系340555017探讨!

    无忧主机相关文章推荐阅读:

    WORDPRESS优化主题使速度得到提高

    如何让您的WORDPRESS网站更加完美

    如何判断文章优劣?WORDPRESS文章星级评价插件!

    WORDPRESS“预加载”功能实现插件:INSTANTCLICK

    本文地址:http://www.51php.com/wordpress/17430.html