2016年5月5日 星期四

美化blogger標籤雲

1.後台 → 版面配置 → 新增小工具 → 選擇「標籤」工具(標籤雲)
2.修改css樣版
 請到後台「範本」→「編輯 HTML」,游標點進範本區塊,按 Ctrl-F 搜尋 </head> 這個字串,找到後在此字串的前一行,插入以下程式碼:
<style>
/* 標籤雲 start*/
.label-size a {
background: #000; /* 底色 */
padding: 8px; /* 內櫬距離 */
display: inline-block;
margin: 0 2px 6px 0;
color: #fff; /* 文字顏色 */
text-decoration: none;
transition: background 0.5s; /* 動畫效果及時間 */
-webkit-transition: background 0.5s;
-moz-transition: background 0.5s;
}
.label-size a:hover {
background: #aaa; /* 滑鼠經過的顏色 */
}
.label-size span { /* 標籤頁面的 CSS */
display: inline-block;
background: #aaa; /* 底色 */
color: #fff;
padding: 8px;
}
/* 標籤雲 end*/
</style>