Question

我试图使用CSS覆盖jQuery UI手风琴风格，但无论我尝试什么，我似乎无法让它工作。我正在使用图像作为我的＆＃34;手风琴标题＆＃34;然而，我仍然看到jQuery UI风格应用于手风琴 - 而不是H3标签 - 它周围有一个圆形灰色边框（我希望标题或内容周围没有边框）

我不想完全删除jQuery UI样式，因为我有其他基于文本的手风琴，它们在样式上看起来非常好。但我无法弄清楚我在这里做错了什么。

HTML：

<div class="collapsedAccordion noStyleAccordion">
<a href="#"><img src="img/complex.jpg" border="0" onmouseover="this.src='img/complex2.jpg'" onmouseout="this.src='img/complex.jpg'" /></a>
    <div>
        <p>ACCORDION 1 CONTENT</p>
    </div>
<a href="#"><img src="img/maps.jpg" border="0" onmouseover="this.src='img/maps2.jpg'" onmouseout="this.src='img/maps.jpg'" /></a>
    <div>
        <p>ACCORDION 2 CONTENT</p>
    </div>
</div>

JAVASCRIPT：

$(".collapsedAccordion").accordion({
            collapsible: true,
            autoHeight: false,
            heightStyle: "content",
            active: false
        });

CSS：

.noStyleAccordion .ui-accordion .ui-accordion-header .ui-accordion-content {
padding: none;
background: none;
border: none;
outline: none;
}

任何帮助都会非常感激！

Answer 1

根据您在评论中提供的链接，您调用元素的顺序有点偏。

使用下面的风格让它运转起来：

.noStyleAccordion .ui-accordion-header, .noStyleAccordion .ui-accordion-content {
     padding: 0;
     background: none;
     border: none;
     outline: none;
}

试图用CSS覆盖jQuery UI手风琴风格，而不是工作

1 个答案: