Hexo Next主题将头像显示成圆形,鼠标放上去有旋转效果。
将头像显示成圆形,鼠标放上去有旋转效果。
找到/themes/next/source/css/_common/components/sidebar/sidebar-author.styl
替换其中的site-author-img和site-author-image:hover属性
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26
| .site-author-image { display: block; margin: 0 auto; padding: $site-author-image-padding; max-width: $site-author-image-width; height: $site-author-image-height; border: site-author-image-border-color; /* start*/ border-radius: 50% webkit-transition: 1.4s all; moz-transition: 1.4s all; ms-transition: 1.4s all; transition: 1.4s all; /* end */ }
/* start */ .site-author-image:hover { background-color: webkit-transform: rotate(360deg) scale(1.1); moz-transform: rotate(360deg) scale(1.1); ms-transform: rotate(360deg) scale(1.1); transform: rotate(360deg) scale(1.1); } /* end */
|