在網(wǎng)上瀏覽博客時經(jīng)?？吹巾撁娴挠疑辖腔蜃笊辖怯幸粋€fork me on github的按鈕，本文將介紹如何實現(xiàn)。
1、效果展示
右上角截圖
right
左上角截圖
left
2、實現(xiàn)
2.1、樣式挑選
點我跳轉(zhuǎn) 挑選你自己喜歡的樣式。
2.2、next主題實現(xiàn)
打開文件：hexo博客根目錄\themes\next\layout\_layout.swig 找到如下代碼塊
<div class="{{ container_class }} {% block page_class %}{% endblock %} ">
<div class="headband"></div>
添加自己喜歡的樣式后結(jié)果如下
<div class="{{ container_class }} {% block page_class %}{% endblock %} ">
<div class="headband"></div>
<a target="_blank" ></a>
訪問你的本地服務測試看看修改的效果吧。
2.3、小屏幕不顯示fork me on github
按照上面的步驟當屏幕縮小后還會顯示fork me on github圖標，但這不是我想要的，我希望在大屏下顯示，小屏后就不顯示了。方法如下：
修改文件hexo博客根目錄\themes\next\layout\_layout.swig 找到如下代碼塊
<html class="{{ html_class | lower }}">
<head>
{% include '_partials/head.swig' %}
<title>{% block title %}{% endblock %}</title>
添加如下代碼，結(jié)果如下
<head>
{% include '_partials/head.swig' %}
<title>{% block title %}{% endblock %}</title>
<style>
.forkme{
display: none;
}
@media (min-width: 768px) {
.forkme{
display: inline;
}
}
</style>
</head>
最后在2.2節(jié)添加的代碼塊上套上div加上class就行了，如下
<div class="forkme">
<a target="_blank" ></a>
</div>
最后在試試效果達到自己的想要的了
