0%

hexo next首页文章加框

  我的博客首页的文章列表一直是连起来的,看起来不爽。因而一直在搜索如何加边框,搜出来的是如何添加文章边框阴影效果。看起来也对。于是就开始照猫画虎。

例如这位大仙说要在themes/next/source/css/_custom/custom.styl里面加入:

1
2
3
4
5
6
7
.post {
margin-top: 0px;
margin-bottom: 60px;
padding: 25px;
-webkit-box-shadow: 0 0 5px rgba(202, 203, 203, .5);
-moz-box-shadow: 0 0 5px rgba(202, 203, 204, .5);
}

  可是我没有custom.styl啊,连_custom文件夹都没有啊。咋办呢?直接建一个呗。建了以后也不行。我还一度怀疑自己的next版本不对,用不了custom.styl。

  后来又搜到这位神仙。是这个样子干的。

  在themes/next/source/css/_common/components/post/post.styl中找到.post-block
然后改成这个样子:

1
2
3
4
5
6
7
8
9
10
if xxxxx
.post-block {
opacity: 0;
margin-top: 60px;
margin-bottom: 60px;
padding: 25px;
-webkit-box-shadow: 0 0 5px rgba(202, 203, 203, .5);
-moz-box-shadow: 0 0 5px rgba(202, 203, 204, .5);
}
.pgaination, xxxx

  谁知我用的是copy,也没仔细看那个神仙的脚本里面可能估计将post-block中的短横线敲作了下划线。我拷贝过来试了,没用。一度以为这个边框是永远加不上了。谁知今天鬼使神差的对比了一下神仙贴出的图,发现了问题。于是改了过来,结果就可以了。我估计神仙是故意打错了,让我们这些小白出错了长记性。只可惜自己不懂css啊,懂的话就没那么麻烦了。

边框

  这个边框效果还凑合吧。

有疑问或建议请发邮件到junxie01@gmail.com。