无意间搜索wordpress美化教程看到这个,觉得还是蛮不错的,比较之前扁平矩形的缩略图看起来效果提升了不少,分享下美化教程,喜欢的可以参考一下。
首先是为文章列表页的缩略图添加圆角和阴影效果:
添加代码到style.css
.thumbnail {
border-radius: 6px;
box-shadow: rgba(0,0,0,0.5) 3px 3px 3px;
}
修改后效果
wordpress文章列表页添加鼠标悬停选中时浮动3D效果:
添加代码到style.css
.entry-more a {
opacity:0
}
.post:hover .entry-more a {
rightright:0;
opacity:1;
}
.post {
transition:all 0.3s ease 0s;
}
.post:hover {
transform:translateY(-3px);
z-index:1;
-webkit-box-shadow:0 15px 32px rgb(175,135,255)!important;
}
修改后效果
© 版权声明
THE END
喜欢就支持一下吧