子比主题美化教程：首页文章列表悬停上浮动效

为提升用户交互体验与页面视觉层次，好软猫带来一款轻量级的 首页文章列表悬停上浮动效 美化方案。当访客将鼠标悬停在子比主题（Zibll）首页的文章卡片上时，卡片会平滑上浮并伴随轻微阴影变化，营造出“可点击”的立体感。本效果通过纯 CSS 实现，只需将代码粘贴至「主题设置 → 自定义 CSS」中，无需修改主题文件，兼容响应式布局，主题更新无忧。

效果演示

文章列表悬停上浮动效 CSS 代码

/*首页文章列表悬停上浮 _ 好软猫[www.haoruanmao.com]*/
@media screen and (min-width: 980px){.tab-content .posts-item:not(article){transition: all 0.3s;}.tab-content .posts-item:not(article):hover{transform: translateY(-10px);box-shadow:0 8px 10px rgba(255,112,173,0.35);}}
/*首页文章列表悬停上浮 _ 好软猫[www.haoruanmao.com]*/