ICHARM
【CSS】多说头像旋转样式
【CSS】多说头像旋转样式

主题自带了头像旋转的css样式,但是我使用了多说评论框,于是想着把主题的头像旋转样式提取出来应用在多说上

头像旋转样式

/*多说附加样式*/
#ds-reset .ds-avatar{background:none !important; box-shadow:none !important;}
#ds-reset .ds-avatar img , #ds-thread #ds-reset ul.ds-children .ds-avatar img{width:50px !important;height: 50px !important;-webkit-transition: .8s;-moz-transition: .8s;-o-transition: .8s;-ms-transition: .8s;padding:3px;border: 1px solid #ddd;background: #fff;}
.ds-post:hover .ds-avatar img{transform:rotate(720deg);-webkit-transform:rotate(720deg);-moz-transform:rotate(720deg);-o-transform:rotate(720deg);-ms-transform:rotate(720deg);border-radius:30px !important;}
#ds-reset .ds-avatar img:hover{transform:rotate(720deg);-webkit-transform:rotate(720deg);-moz-transform:rotate(720deg);-o-transform:rotate(720deg);-ms-transform:rotate(720deg);border-radius:30px !important;}
#ds-thread #ds-reset .ds-comment-body, #ds-thread #ds-reset ul.ds-children .ds-comment-body{padding-left:70px !important;}
#ds-thread #ds-reset .ds-comment-body, #ds-thread #ds-reset ul.ds-children .ds-comment-body{padding-left:70px !important;}
.ds-post:hover{background:#eee !important;}
#ds-thread #ds-reset ul.ds-children .ds-avatar{width:50px !important;}
#ds-thread #ds-reset .ds-replybox{padding: 0 0 0 80px !important;}
#ds-reset #ds-ctx .ds-ctx-entry .ds-ctx-body{margin-left: 68px !important;}
#ds-recent-comments li.ds-comment:nth-of-type(1){border:none !important;}
/*多说附加样式结束*/

给多说用上

后台-多说评论-个性化设置-基础设置-自定义css 把上面的样式粘贴在这里,拉到最下面,保存即可。

http://www.icharm.me/wp-content/uploads/2015/11/2015110901580861.png

 

赶快在下面评论看看效果吧!!

 

发表评论

textsms
account_circle
email

ICHARM

【CSS】多说头像旋转样式
主题自带了头像旋转的css样式,但是我使用了多说评论框,于是想着把主题的头像旋转样式提取出来应用在多说上 头像旋转样式 /*多说附加样式*/ #ds-reset .ds-avatar{background:none !i…
扫描二维码继续阅读
2015-11-13