如何在Blogger中自定義下拉存檔小部件？

Question

我想要一些有關自定義存檔窗口小部件的幫助。 我已經嘗試過搜索引擎尋找任何教程，但無濟於事。

在測試人員博客上，我安裝了默認的下拉歸檔窗口小部件。 我絕對不喜歡這種外觀，我試圖改變它的各種元素，例如字體，字母間距，顏色，邊框等，但是我一無所獲。

關於如何自定義層次結構和平面歸檔窗口小部件的教程不計其數，但下拉菜單選項則一無所獲。 之前有人告訴我，相同的編碼可以應用於任何一個歸檔窗口小部件選項，但是我發現這不起作用。

下面說明了我用於自定義小部件的代碼。 我只是在標簽之間添加了此編碼：

#BlogArchive1 ul li { 
    text-transform: uppercase; 
    text-align: center; 
    font-size: 16px; 
    letter-spacing: 0.08em; 
    font-weight: normal !important; 
    color: #171717; 
    border: 0; 
    width: 90%; 
    outline: none; 
    text-align: center; 
    background-color: #fffffff;
}
#BlogArchive1 a { 
    color: #171717 !important; 
    font-weight: normal !important;
} 

我嘗試創建的外觀非常簡單，沒有邊框，背景為白色。

Answer 1

真的，這很簡單。 您只需要使用以下代碼即可進一步自定義：

#BlogArchive1 ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
#BlogArchive1 ul li {
    float: left;
}
#BlogArchive1 ul li a { 
    text-transform: uppercase; 
    text-align: center; 
    font-size: 16px; 
    letter-spacing: 0.08em; 
    font-weight: normal !important; 
    color: #171717; 
    border: 0; 
    width: 90%; 
    outline: none;
    display: block;
    padding: 8px 15px;
    text-align: center; 
    text-decoration: none;
    background-color: #fffffff; 
}
#BlogArchive1 ul li a { 
    color: #171717
}
#BlogArchive1 ul li a:focus { 
    color: #333;
}