版權聲明是指作品權利人對自己創作作品的權利的一種口頭或書面聲明，一般版權聲明應該包括權利歸屬、作品使用准許方式、責任追究等方面的內容。諸如平時看文章時最后會有一個嚴禁轉載的說明，其實這就是版權聲明。
當我們的網站通過省通信管理局審核之后，會要求在網站的底部添加備案信息。
雖然隨着社會的發展，越來越多的屌絲也開始在網上建站了，但是許多的朋友，比我我，剛開始建站的時候，不熟悉網站的相關代碼以及Html標簽，不知道在網站的哪個地方添加版權說明。然后我研究了一個早上之后，將這個方法分享出來，希望能夠幫助到各位。
我的網站是使用Typecho搭建的，因此我下面所描述的方法也是在Typecho基礎上進行描述的，如果你的網站不是基於Typecho的，可以查看網頁的代碼，在相應的位置進行修改即可。
實踐事前我們先看看，添加的版權說明，是否符合網站整體的審美以及個人的審美觀，符合之后我們在進行修改。
實現的效果還行吧，起碼比之前的看起來爽多了，不好看的話，也沒有必要花費精力進行修改了。
代碼實現
實現的效果看了，接下來我們上干貨了，我們來看具體的實現代碼了。
我們看到網站上的各種顏色，各種字體等的控制是通過CSS樣式進行實現的。
CSS樣式：
.github-badge {
display: inline-block;
border-radius: 4px;
text-shadow: none;
font-size: 12px;
color: #fff;
line-height: 15px;
background-color: #ABBAC3;
margin-bottom: 5px;
}
.github-badge .badge-subject {
display: inline-block;
background-color: #4D4D4D;
padding: 4px 4px 4px 6px;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
.github-badge .badge-value {
display: inline-block;
padding: 4px 6px 4px 4px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
.github-badge .bg-brightgreen {
background-color: #4c1 !important;
}
.github-badge .bg-green {
background-color: #97CA00 !important;
}
.github-badge .bg-yellow {
background-color: #dfb317 !important;
}
.github-badge .bg-yellowgreen {
background-color: #a4a61d !important;
}
.github-badge .bg-orange {
background-color: #fe7d37 !important;
}
.github-badge .bg-red {
background-color: #e05d44 !important;
}
.github-badge .bg-blue {
background-color: #007ec6 !important;
}
.github-badge .bg-grey, .github-badge .bg-gray {
background-color: #555 !important;
}
.github-badge .bg-lightgrey, .github-badge .bg-lightgray {
background-color: #9f9f9f !important;
}
CSS樣式添加方法：
打開Typecho網站后台-》外觀-》設置外觀-》開發者設置-》自定義CSS，添加以上CSS樣式。
我們將CSS樣式添加之后，接下來我們需要添加展示的內容，以及將展示的內容和CSS進行關聯。
在關聯之前，我們看一下，CSS樣式支持的徽章的效果。
HTML代碼：
<div> <div class="github-badge"> <span class="badge-subject">build</span><span class="badge-value bg-brightgreen">passing</span> </div> <div class="github-badge"> <span class="badge-subject">build</span><span class="badge-value bg-red">failure</span> </div> <div class="github-badge"> <span class="badge-subject">tests</span><span class="badge-value bg-green">185 passed, 7 skipped</span> </div> <div class="github-badge"> <span class="badge-subject">tests</span><span class="badge-value">inaccessible</span> </div> </div> <div> <div class="github-badge"> <span class="badge-subject">npm</span><span class="badge-value bg-blue">v5.5.1</span> </div> <div class="github-badge"> <span class="badge-subject">node</span><span class="badge-value bg-brightgreen">>=0.4.0</span> </div> <div class="github-badge"> <span class="badge-subject">gem</span><span class="badge-value bg-orange">v0.2.5</span> </div> </div> <div> <div class="github-badge"> <span class="badge-subject">stars</span><span class="badge-value bg-brightgreen">☆☆☆☆☆</span> </div> <div class="github-badge"> <span class="badge-subject">node</span><span class="badge-value bg-yellowgreen">★★★☆☆</span> </div> </div> <div> <div class="github-badge"> <span class="badge-subject">color</span><span class="badge-value bg-brightgreen">brightgreen</span> </div> <div class="github-badge"> <span class="badge-subject">color</span><span class="badge-value bg-green">green</span> </div> <div class="github-badge"> <span class="badge-subject">color</span><span class="badge-value bg-yellowgreen">yellowgreen</span> </div> <div class="github-badge"> <span class="badge-subject">color</span><span class="badge-value bg-yellow">yellow</span> </div> <div class="github-badge"> <span class="badge-subject">color</span><span class="badge-value bg-orange">orange</span> </div> <div class="github-badge"> <span class="badge-subject">color</span><span class="badge-value bg-red">red</span> </div> <div class="github-badge"> <span class="badge-subject">color</span><span class="badge-value bg-lightgrey">lightgrey</span> </div> <div class="github-badge"> <span class="badge-subject">color</span><span class="badge-value">grey</span> </div> <div class="github-badge"> <span class="badge-subject">color</span><span class="badge-value bg-blue">blue</span> </div> </div>
HTML代碼顯示的效果：
Typecho博客食用方法
目前我的這個版權添加是在Handsame主題上進行修改的，如果你是使用其他，請參考該修改辦法，在你的主題上進行修改。
進入網站根目錄，進入handsame主題文件夾-》component，在componet目錄下的footer.php文件里面，將標簽替換為以下內容。
<div class="wrapper bg-light"> <span class="pull-right hidden-xs text-ellipsis"> <?php $this->options->BottomInfo(); ?> <div class="github-badge"> <a target="_blank" href="https://www.ddsiot.cn"> <span class="badge-subject">Powered by</span><span class="badge-value bg-blue">叮當物聯</span></a> </div> </span> <div class="github-badge"> <span class="badge-subject">Copyright</span><span class="badge-value bg-brightgreen">© <?php echo date("Y");?></span> </div> <?php $this->options->BottomleftInfo(); ?>
以上步驟修改完成之后，清除緩存，刷新博客試試，是不是博客看起來比之前的順眼多了。