久久久久av_欧美日韩一区二区在线_国产精品三区四区_日韩中字在线

Discuz! 官方交流社區(qū)

標題: 分享一下我正在用的美化樣式 [打印本頁]

作者: 凡爾鍋 時間: 2023-1-16 16:42
標題: 分享一下我正在用的美化樣式
如下。我自我感覺非常好看，大家可以去試試。
<style>
/*自定義網站字體開始*/
@font-face{font-family: "lovely";src: url("https://www.flweb.xyz/fileto/WebFont.woff2") format("woff2");font-display: swap;}
*{font-family: "lovely"}
/*自定義網站字體結束*/
/*自定義滾動條開始*/
::-webkit-scrollbar {
width: 0.5rem;
height: 0.5rem;
}

::-webkit-scrollbar-thumb {
border-radius: 0.125rem;
-moz-border-radius: 0.125rem;
-webkit-border-radius: 0.125rem;
background-color: #c85863;
}

::-webkit-scrollbar-track {
background-color: #000000;
}
/*自定義滾動條結束*/
input#scbar_txt {
width: 200px;
transition: 0.4s;
}
input#scbar_txt:hover{
width:400px;
}
/*自定義閱讀進度條開始*/
#content_progress {
   /* Positioning */
   position: fixed;
   left: 0;
   top: 0;
   z-index: 1000;
   width: 100%;
   height: 5px;
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
   border: none;
   background-color: transparent;
   color: #35a935;
}

#content_progress::-webkit-progress-bar {
   background-color: transparent;
}

#content_progress::-webkit-progress-value {
   background-color: #c85863;
}

#content_progress::-moz-progress-bar {
   background-color: #c85863;
}
/*自定義閱讀進度條結束*/
/*搜索框懸停上浮開始*/
input#scbar_txt:hover{opacity: 1;z-index: 99;border-radius: 20px;transform: translateY(-5px);box-shadow: 0 3px 20px rgba(0, 0, 0, .25);animation: index-link-active 1s cubic-bezier(0.315, 0.605, 0.375, 0.925) forwards;}
@keyframes index-link-active {
0%{transform: perspective(2000px) rotateX(0) rotateY(0) translateZ(0);}
16%{transform: perspective(2000px) rotateX(10deg) rotateY(5deg) translateZ(32px);}
100%{transform: perspective(2000px) rotateX(0) rotateY(0) translateZ(65px);}
}
/*搜索框上浮結束*/
/*搜索欄樣式開始*/
input#scbar_txt {
width: 200px;
transition: 0.3s ease-in;
border-radius: 5px 0px 0px 5px;
}
#scbar_type {border-radius: 0 5px 5px 0;}
input#scbar_txt:hover{
width:400px;
}
/*搜索欄樣式結束*/
/*背景修改開始*/
body {
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
background: #c8e2fb;
background-image: linear-gradient(45deg, #c8e2fb, #fbecd6);
}
/*背景修改結束*/
/*頁面圓角開始*/
.cl ,.fl ,.bm{
border-radius: 20px;
}
/*頁面圓角結束*/
</style>

作者: 凡爾鍋 時間: 2023-1-16 16:44
那個閱讀進度條是要用其它代碼配合的，單獨使用無效

作者: 阿狗君同志 時間: 2023-1-16 19:30
我的抄了不少。你也是（）

作者: 小花 時間: 2023-1-17 09:49
代碼放在哪里呢

作者: 凡爾鍋 時間: 2023-1-17 11:24

小花發(fā)表于 2023-1-17 09:49
代碼放在哪里呢

可以放在底部統(tǒng)計代碼里面。

作者: 阿狗君同志 時間: 2023-1-17 12:59
哈哈哈，寫的時候注意多段適配啊

作者: 好好先生 時間: 2023-1-26 19:26
我的站點哈：https://www.sanweishu.cn/

歡迎光臨 Discuz! 官方交流社區(qū) (http://m.9999xn.com/)

久久久久av_欧美日韩一区二区在线_国产精品三区四区_日韩中字在线