网站美化：评论嵌套太多导致手机端显示丑陋解决办法

2018年1月19日16:24:00 发表评论 472 °C

摘要

评论如果嵌套层数太多，手机端显示都会堆叠在一起，很难看。一个可用的解决办法就是可以减小每层嵌套的间隔。

网站美化：评论嵌套太多导致手机端显示丑陋解决办法

一、前言

评论如果嵌套层数太多，手机端显示都会堆叠在一起，很难看。一个可用的解决办法就是可以减小每层嵌套的间隔。

二、代码部署

这个代码只针对知更鸟主题用户，其他用户需要自行修改。使用之后，嵌套评论框变窄：

知更鸟主题的用户可以添加到外观->主题设置->定制风格->自定义样式里面。

/*评论列表嵌套框缩小*/
.comment-list .depth-1,.comment-list .depth-2,.comment-list .depth-3,.comment-list .depth-4,.comment-list .depth-5{position:relative;background:#fff;margin:0 0 10px 0;padding:8px 15px;border:1px solid #eaeaea;box-shadow:0 1px 1px rgba(0,0,0,0.04);border-radius:2px;word-wrap:break-word;word-break:break-all}@media screen and (max-width:620px){.authorbio .spostinfo .i-time{display:none}}

/*评论列表嵌套框缩小*/

.comment-list .depth-1,.comment-list .depth-2,.comment-list .depth-3,.comment-list .depth-4,.comment-list .depth-5{position:relative;background:#fff;margin:0 0 10px 0;padding:8px 15px;border:1px solid #eaeaea;box-shadow:0 1px 1px rgba(0,0,0,0.04);border-radius:2px;word-wrap:break-word;word-break:break-all}@media screen and (max-width:620px){.authorbio .spostinfo .i-time{display:none}}