javascript - 为选项卡的其余部分着色

Question

我想将标签区域的其余部分涂成黄色。在这个jsfiddle 中，只有选项卡顶部和主体是黄色的。

  <div id="tabs">
<ul>
  <li><a href="#tabs-1">Nunc tincidunt</a></li>
  <li><a href="#tabs-2">Proin dolor</a></li>
  <li><a href="#tabs-3">Aenean lacinia</a></li>
</ul>
 <div id="tabs-1">

Answer 1

使用小提琴中的 CSS：

body {
    font-size: 0.8em;
}
/*
 * Custom styles for the inactive tabs
 */
 .ui-tabs-nav li.ui-state-default a {
    background-color: blue;
    color: yellow;
}
/*
 * Custom styles for the active tab
 */
 .ui-tabs-nav li.ui-state-active a {
    background-color: yellow;
    color: black;
}
p, #tabs-1, #tabs-2, #tabs-3 {
    background-color: yellow;
}

我添加了您的 tab<div>的 ID，这就成功了。

小提琴

---

编辑

更进一步，您甚至可以向您的选项卡添加一个类<div>，然后无需将每个单独的 ID 添加到 CSS，只需添加类名即可。