|
先說明,我不懂代碼,下面代碼是默認樣式1紅的基礎上折騰多少天,一個一個試出來的。目前整體實現了透明底色,但網站開通了左邊欄,邊欄底色沒有解決透明,另外,打開網頁如果網速慢的時候,就是在網頁沒有打開的時間點上,全頁面顯示紫色。所以,有人說你網站太紫了,其實是我沒有找到這個解決辦法,在哪修改。
背景圖片,更換據默認的小圖片,直接放大圖片(寬1360px,高2240px左右),以淺淡為主,如果選擇深色,可能要修改字體顏色才能顯示清楚。我是在win11下先調整格式大小,再在網上找到轉換成bweg格式,最小時圖片文件只有二十KB到三十KB大小。
高手如果看到問題所在,還希望指點一二,讓更多的小白,少走彎路。
/*
[name]紫[/name]
[iconbgcolor]#9400D3[/iconbgcolor]
Powered by Discuz! X
*/
html { background: #9400D3 url(background.webp); }
::selection{ background-color: #9370DB; color:#CFBED7; }
:focus { outline-color: #9400D3; }
body { background: transparent url(bgimg.webp) no-repeat 50% 0; background-size: 970px; } /*全局底色*/
@media(min-resolution:120dpi){ body { background-image: url(bgimg2x.jpg); }}
.fc-p { color: #9400D3; } /* 板塊帖子標題圖片標示色 */
#nv { background-color: #9400D3; } /* 主導航 */
#nv li.a { background-color: #BA55D3; } /* 導航當前區顯示色 */
#nv li a:hover, #nv li.hover a:hover, #nv li.hover a { background-color: #ADFF2F; } /* 鼠標放置顯示色 */
#scbar { background-color: #D2CADC; border-color: #FFA500; } /* 主導航搜索欄底色,線條 */
#scbar_btn { background-color: #9400D3; } /*主導航搜索確定按紐色*/
#scform_srchtxt { border-color: #9400D3; } /*搜索頁導航邊框色*/
#scform_tb .a::before { border-bottom-color: #9400D3; }
#scform_submit { background-color: #9400D3; } /*搜索確認按紐色*/
.bm_h, .tl th, .tl td { border-bottom-color: #D8BFD8; } /* 板塊帖子標題間隔線條色 */
.fl .bm_h { border-color: #BC00DD; background: transparent; } /*分區板塊線條,標題底色*/
/* 重定義論壇底部,家園,群組標題底色,內容左邊欄,分類發布框選項部分底色, {SPECIALBG} */
.bmn, .bm_h, td.pls, .ad td.plc, div.exfm, .tb a, .tb_h, .ttp li.a a, div.uo a, input#addsubmit_btn, #gh .bm .bm_h { background-color: transparent; }
.ct2_a, .ct3_a { background-image: url(vlineb.jpg); }
.ct3_a .bm { background-color: transparent; } /*中間,右邊底色*/
.tbn li.a { background: #CFBED7 url(background.webp); }
#nv_portal.pg_portalcp .ct2_a_r, #nv_forum.pg_post .ct2_a_r, #nv_group.pg_post .ct2_a_r { background-image: none; }
/* 重定義 {SPECIALBORDER} */
.bmn, .pg a, .pgb a, .pg strong, .card, .card .o, div.exfm { border-color: #9400D3; }
.pg strong { background-color: #9400D3; }
.pnc, .tb .o, .tb .o a { background-color: #9400D3; }
.pnc, a.pnc, .tb .o { border-color: #9370DB; }
.pnc:active { background: #9370DB; }
.pnc:focus { box-shadow: 0 0 0 2px rgba(136, 0, 0, 0.25); }
.mi #moodfm.hover textarea { border-color: #9400D3; }
.ad td.pls { background-color: #9400D3; }
.side_btn a svg { fill: #9400D3; }
/* 重定義字體 */
#qmenu, .fl .bm_h h2 a, .xi1, #um .new, .topnav .new, .sch .new, .el .ec .hot em, .pll .s a.joins, #diy_backup_tip .xi2 { color: #9400D3; }
.pll .s a.go { color: #FFF; }
.xi2, .xi2 a { color: #000; }
/* 重定義按鈕 */
.pgsbtn { background-color: #9400D3; }
.pgsbtn:hover { background-color: #9370DB; }
.pgsbtn:active { box-shadow: 0 0 0 3px rgba(136,0,0,0.25); }
.el .ec .hot, .clct_list .xld .m { background-image: linear-gradient(0deg,#BA55D3 40%,#9932CC 40%); }
.pll .s { background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='60' height='89'%3e%3cpath fill='%23cae7e2' d='M60 0v50c0 5.5-4.5 10-10 10H0V10C0 4.5 4.5 0 10 0z'/%3e%3cpath fill='%239ad1cf' d='M60 65v19c0 2.75-2.25 5-5 5H0V70c0-2.75 2.25-5 5-5zM8 75l2.5 2.5L8 80h2l2.5-2.5L10 75z'/%3e%3c/svg%3e"); }
/* 重定義 Tab */
.tb .a a { border-bottom-color: #BA55D3; background: url(background.webp); }
/* 重定義廣播 */
#uhd, #flw_header .bar { background-color: #CFBED7; }
#uhd .tb a, #flw_header .bar { border-top-color: #CFBED7; }
#uhd .tb .a a { border-bottom-color: #CFBED7; }
.flw_replybox { background-color: #CFBED7; }
.flw_replybox .px, .flw_autopt, #flw_header .tedt { border-color: #9400D3; }
#flw_post_extra .sec { border-color: #CFBED7; background-color: #CFBED7; }
/* 重定義版塊快速跳轉和側邊導航 */
#fjump_menu li.a a { background-color: #D2CADC; }
.bdl, .bdl dt, .bdl dd.bdl_a a { border-color: #DDA0DD; background-color: #D2CADC; }
.bdl dd.bdl_a a { color: #9400D3; }
/* 重定義下拉菜單 */
.p_pop a { border-bottom-color: #CFBED7; }
.p_pop a:hover, .p_pop a.a, #sctype_menu .sca { background-color: #CFBED7; color: #9400D3; }
.blk a:hover { background-color: transparent; }
/* 重定義好友列表 */
#nv_home .buddy li { background-color: transparent; border: none; }
實現網站透明除了要修改上面所在的地方,修改成透明“transparent”外,網站后臺,模板下全部的背景色為透明。
上面標注可能有誤差,還請測試前做好記錄。
|
|