应该不再修改 xlog 页面样式了,除非我看到更漂亮的页面😜
先说说对 xlog 的印象,作为基本博客肯定够用了,
对于有强迫症想要都随自己心意修改的博主,真的是太难了。
除了刚上手时有些不习惯以外就没啥不满意的地方了,除了被墙!
下边是样式图
下边提供定稿 css 代码
/*--副标题彩色*/
.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);
}
/*--导航条移到顶部*/
.xlog-site-navigation {
position:absolute;
top:0px;
}
/*--连接按钮位置不变*/
.pl-1 {
margin-left:auto
}
/*--调整横幅位置*/
.py-12 {
padding-bottom: 20px;
padding-top: 45px;
}
/*--调整连接上下位置*/
.flex.text-gray-500 {
padding-bottom: 10px;
}
/*-- 顶部代码雨*/
.border-zinc-100 {
background-image:url('https://xlog.app/_next/image?url=https%3A%2F%2Fipfs.4everland.xyz%2Fipfs%2Fbafkreibiivd46q6qfd6dzri6j6ltw53tzrudcqk7fmxhsj32qbqer7zkra&w=1920&q=75');
background-repeat:repeat;
}