小工具背景颜色更改

Question

我在更改我网站上受欢迎的 post 小部件的背景颜色时遇到问题。我发现问题与我的粘性导航菜单有关。所以我的粘性导航菜单的背景是黑色的，出于某种原因，这也影响了我流行的 posts 小部件的背景颜色。这是我的粘性导航背景颜色代码

/* Background & Border of Navigation */
.tabs-inner .widget ul {
background: #000000;
border: 0px solid #eeeeee;
text-align: center  !important;
}

我希望我的热门 post 小部件的背景颜色为透明或白色，同时保持粘性导航的背景颜色为黑色。

这是我的热门代码 post

<style type='text/css'>
.PopularPosts .item-thumbnail a {
clip: auto;
display: block;
height: 180px;
overflow: hidden;
width: 240px;
margin-left: -10px;
}
.PopularPosts .item-thumbnail img {
position: relative;
top: -30px;
transition:all .2s linear;
-o-transition:all .5s linear;
-moz-transition:all .2s linear;
-webkit-transition:all .2s linear;
}

.PopularPosts .item-thumbnail img:hover{
background: transparent;
opacity:.6;
filter:alpha(opacity=60)
}
.PopularPosts .widget-content ul li {
color: #555555;
}

.PopularPosts .item-title {
clear:both;
font: 10px verdana;
color: #222222;
text-transform: uppercase;
text-align: center;
margin-right: 10px;
}

.PopularPosts .item-snippet {
display: none;
}

.widget .widget-item-control a img {
height: 18px;
width: 18px;

}

</style>

我试过实施

background: #ffffff;

在那段代码中，但它仍然没有改变背景颜色？关于如何解决此问题的任何想法？

Answer 1

将此插入 <head> 内的 <stye> 标签：

    .tabs-inner .section:first-child ul {
       background: #000 !important;
    }
    .tabs-inner .widget ul {
       background: transparent !important;
    }

更新： 将 li 个元素居中

    .popular-posts ul { 
       margin: auto !important; 
       width: 1040px !important;
    }

可能您需要使用 @Media queries 来控制这些列表在移动设备中的宽度。

小工具背景颜色更改

Gadget Background Colour Change

html

css

blogs

blogger