wordpress实现用户评论头像圆角化


2680 views

2014-10-23 22:12:58

我们在浏览被人使用 wordpress 建立的博客时,很容易发现的一个效果是文章评论区的用户头像显示为圆形,并且当鼠标经过的时候还会自己旋转一圈,这个效果很动感,深受广大博主的喜爱,想要实现这个效果也不是很难,只需要将下述代码添加到你的主题 style.css 文件中即可,但前提是你使用的是默认自带的评论系统而不是第三方的。 代码如下:
.avatar{padding: 2px;border: 2px solid #cfd9e1;width: 52px;border-radius: 26px;transition: transform 0.5s ease-out;-webkit-transition: -webkit-transform 0.5s ease-out}
.avatar:hover{transform: rotateZ(360deg);-webkit-transform: rotateZ(360deg)}
本代码是基于网上收集的代码修改精简而来,您可以通过修改代码中相应的参数改变头像的显示大小、圆角、以及鼠标经过时旋转的度数和时间,建议将本代码添加到 style.css 的底部,经过本站测试此代码兼容于大多数浏览器。如果还有不懂的欢迎留言。

上一篇:什么样的男友是潜力股

下一篇:不敢说的话,才是最想说的话

扫码与我联系

★ ★ ★ ★ ★

“感谢你的鼓励与陪伴,我们的坚持才有意义”

创新与发展 – 优客记录保留所有权利

站内搜索 鄂ICP备16016329号-1 鄂公网安备42022202000038号