Hexo-theme-next: 如何修改两篇文章之间的间距？

[swordspoet]

Expected behavior (预期行为)

我想缩小两段文章之间的间距，那样会显得比较舒服一点

Actual behavior (实际行为)

source/css/_common/components/post文件中找不到修改代码的地方

Steps to reproduce the behavior (重现步骤)

NexT Informations

Add the ✔ sign before an item which is affected by this behavior.

NexT Version:

• Master
• Latest Release ✔
• Old version -

NexT Scheme:

• All schemes
• Muse
• Mist ✔
• Pisces

Other Informations (Like Browser, System, Screenshots)

我想表达的在右边的图片里→_→[http://p1.bpimg.com/4851/ae45e8aa59082244.jpg]

[innote]

@swordspoet 其實你可以用read more 來美化你的文章。

請看這一篇文章 看這篇文

[swordspoet]

@innote嗯，谢谢，readmore我在之前的文章添加了，这篇没有。我的网站 www.libinx.com

我想调整一下两篇文章的间距，像这个网站的一样www.csuldw.com
From libin.

[innote]

@swordspoet 你可以把在站点配置文章

index_generator:
  per_page: 5

把 per_page: 5 改成 10 或 20, 你的文章距離就會變小了。

[innote]

@swordspoet ， 如果你沒裝， 也可以把 站点配置文章

# Pagination
## Set per_page to 0 to disable pagination
per_page: 10
pagination_dir: page

per_page: 10 改成 20, 應該會給你更好的距離。

[swordspoet]

@innote 我刚把站点配置文件的代码改了，中间的间隔还是没有缩小

[innote]

@swordspoet, 我的會哦， 我得blog， 你有自已改過其它地方嗎？

[swordspoet]

@innote 没有啊，我看了www.csuldw.com在浏览器上面的源码，貌似差别在post.stly文件中

[innote]

@swordspoet, 如果是css， 你就要自已來了， 因爲個人的品味都不一樣。

對不起了， 沒幫上忙。

[swordspoet]

@innote 恩 谢谢 你了 我自己再摸索一下，毕竟不好描述

[xovel]

修改<article>标签的外边距离的大小即可。

[swordspoet]

@xovel 在post.swig文件找不到相关字段额

[innote]

@swordspoet 應該是修改column

[xovel]

@swordspoet 不在swig里面，在样式控制文件里面。看了下你采用的主题是Mist，帮你找了一下，具体位置是在这个文件里面：...\source\css\_schemes\Mist\_posts-expanded.styl。

...
.posts-expand {
  padding-top: 0;

  .post-title,
  .post-meta {
    text-align: $site-meta-text-align;
    +mobile() { text-align: center; }
  }
  .post-eof { display: none; }

  .post { margin-top: 120px; }
  .post:first-child { margin-top: 0; }

  .post-meta {
    margin-top: 5px;
    margin-bottom: 20px;
  }
...

核心代码是这两句：

  .post { margin-top: 120px; }
  .post:first-child { margin-top: 0; }

第一句是每个article（article标签的类名是post）的上边距，你修改这个数值就行了。
第二句是取消第一个文章的上边距。

---

整体的外边距也是可以调的，具体位置在：...\source\css\_schemes\Mist\outline\outline.styl

.main-inner { margin-top: 80px; }

[swordspoet]

@xovel 大哥，我要哭了，找了_common下的所有代码，找遍了所有的资料，问遍了所有的qq群，没有解决问题。以后再也不到网上瞎找了，就来github！！！！

[lniwn]

有同样的需求，mark下，在5.1.3版本中，可以直接修改next/source/css/_custom/custom.styl文件

// 主页文章添加阴影效果
.posts-expand {
    .post {
        margin-top: 60px;
        margin-bottom: 20px;
        padding: 25px;
        -webkit-box-shadow: 0 0 5px rgba(202, 203, 203, .5);
        -moz-box-shadow: 0 0 5px rgba(202, 203, 204, .5);
    }
}

具体效果可以参考我的博客