部落格園主題美化中BUG修復方法

CodeYarn發表於2022-03-27

一、前言

很多部落格園的小夥伴可能都想擁有一個自定義的部落格主題,這個其實也不是想象中那麼難,想要知道如何部署個人部落格主題的小夥伴可以去看看這篇部落格園主題美化 最詳細的美化過程博文,裡面詳細地寫了如何部署主題和更改,但是這款主題皮膚部署出來會有些BUG,接下來,博主就說一下如何解決這些BUG,是頁面更加美觀。

二、導航欄BUG

  1. 描述:很多小夥伴部署完這款主題後,可能會發現它的導航欄特別亂,甚至都重疊在一起了,這個BUG已修復,當初沒有截圖,所以無法看到最初的BUG樣式。

  2. 解決BUG方法和步驟:

    • 去除導航欄文字內容的下劃線無序列表的符號,直接在部落格園後臺CSS中新增如下程式碼

      * {
        text-decoration: none !important;
      }
      ul {
        list-style-type: none;
      }
      
    • 導航文字位置和底部過渡線
      image
      image

      裡面的transition全部改為0.2s

      transition: 0.2s;
      

三、正標題BUG

但我們把topInfo中的title改成自己的標題後,滑鼠懸浮在標題上面時,會發現最初的標題還在,嚴重地影響美觀,其實把main.js中的內容改一下就行,具體位置在構建主頁頭部html部分
image

image

幾乎最大的BUG就這幾個,別的還沒發現,不過把這個改人後已經差不多了

四、附加(去隨筆頁底部的廣告)

  1. 直接在CSS中新增下面的程式碼就行

    /*遮蔽底層廣告*/
    .under-post-card,
    #under_post_card1,
    #under_post_card2{
     	display:none !important;
    }
    
    #ad_t2,#cnblogs_c1,
    #under_post_news,
    #cnblogs_c2,
    #under_post_kb {
      display:none!important;
    }
    
感謝你的閱讀,如果你也解決了自己主題的BUG,就點個贊加推薦吧

相關文章