Question

我无法更改网站上热门帖子小部件的背景颜色。我发现问题与我的粘性导航菜单有关。所以我的粘性导航菜单的背景是黑色的，由于某种原因，这也影响了我的热门帖子小部件的背景颜色。这是我的粘性导航背景颜色的代码

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

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

这是我热门帖子的代码

<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来控制移动设备中这些列表的宽度。

小工具背景颜色变化

1 个答案: