先寫一部分,沒改完呢,怕最後懶癌發作不想寫了😅
下邊的教程就是本博客的樣式
黑暗模式下更漂亮
導航欄圖標直接複製拿走,
沒找到美化 xlog 的教程自己動手豐衣足食#
上邊的黑色橫幅樣式博主用的全透明圖片
不用找了,圖片就是一片空白
直接下載拿走放到 站點設置 - 常規 - 橫幅#
直接把下邊代碼複製到 自定義 CSS#
/*--導航欄添加白色上邊框*/
.items-center.text-gray-500 {
border-top: 1px solid white; // 只需要上邊框,使用下邊框也可
}
/*--副標題彩色*/
.whitespace-pre-wrap {
background-image: -webkit-linear-gradient(left,#3498db,#f47920 10%,#d71345 20%,#f7acbc 30%,#ffd400 40%,#3498db 50%,#f47920 60%,#d71345 70%,#f7acbc 80%,#ffd400 90%,#3498db);
color: transparent;
-webkit-background-clip: text;
-webkit-animation: slide 2s infinite linear;
animation: slide 5s infinite linear;
}
/*--文章概要變大*/
.xlog-post:hover {
transform: scale(1.2);
-webkit-transform: scale(1.1);
-moz-transform: scale(1.2);
-o-transform: scale(1.2);
-ms-transform: scale(1.2);
}
.xlog-post {
padding: 1rem;
}
/*---歸檔文章列表變大*/
.items-center.-mx-2:hover {
transform: scale(1.2);
-webkit-transform: scale(1.1);
-moz-transform: scale(1.2);
-o-transform: scale(1.2);
-ms-transform: scale(1.2);
}
/*--按鈕變大*/
.button:hover {
transform: scale(1.2);
-webkit-transform: scale(1.1);
-moz-transform: scale(1.2);
-o-transform: scale(1.2);
-ms-transform: scale(1.2);
}