Question

我试图摆脱/覆盖我主页上图片的渐变过滤器，并且我使用了这个子主题：http://my.studiopress.com/themes/altitude/#demo-full

我是新手，但这是我编辑过的代码：

.image-section {
background: -moz-linear-gradient(top,  rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.5) 30%, rgba(0,0,0,0.8) 80%, rgba(0,0,0,0.9) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.2)), color-stop(30%,rgba(0,0,0,0.5)), color-stop(80%,rgba(0,0,0,0.8)), color-stop(100%,rgba(0,0,0,0.9)));
background: -webkit-linear-gradient(top,  rgba(0,0,0,0.2) 0%,rgba(0,0,0,0.5) 30%,rgba(0,0,0,0.8) 80%,rgba(0,0,0,0.9) 100%);
background: -o-linear-gradient(top,  rgba(0,0,0,0.2) 0%,rgba(0,0,0,0.5) 30%,rgba(0,0,0,0.8) 80%,rgba(0,0,0,0.9) 100%);
background: -ms-linear-gradient(top,  rgba(0,0,0,0.2) 0%,rgba(0,0,0,0.5) 30%,rgba(0,0,0,0.8) 80%,rgba(0,0,0,0.9) 100%);
background: linear-gradient(to bottom,  rgba(0,0,0,0.2) 0%,rgba(0,0,0,0.5) 30%,rgba(0,0,0,0.8) 80%,rgba(0,0,0,0.9) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#33000000', endColorstr='#e6000000',GradientType=0 );
display: table;
overflow: hidden;
table-layout: fixed;
width: 100%;
}

我尝试将其更改为：

.image-section {
background: none;
background-color: transparent;
display: table;
overflow: hidden;
table-layout: fixed;
width: 100%;
}

我甚至尝试过＃34;！important＆＃34;，但似乎没有什么能解决它。这个php（在customize.php中）可以与它有关吗？

global $wp_customize;

$images = apply_filters( 'altitude_images', array( '1', '3', '5', '7' ) );

在此先感谢您的帮助 - 我对此感到陌生，感谢您的理解。

Answer 1

我看了一下页面。您无法覆盖背景的原因是因为它使用了媒体查询：@media all {}。

根据强大的@BoltClock的建议，媒体不会增加特异性，因此或多或少可以快速修复：

CSS

div .image-section {
    background: none;
}

会增加特异性，所以如果最后一条规则不起作用，可能会有一些javascript或php在应用css后应用该类。

如何使用CSS覆盖此渐变过滤器？

1 个答案:

CSS