css - CSS Nth 子选择器 - 样式

Question

<a class="abc">
     <span class="def">foo</span>
     bar
   </a>

我如何定位栏以使其粗体 - 我不能给它任何 css 类，尝试了第 n 个孩子但没有工作 - 像这样尝试了第 n 个孩子：但没有工作 - 在 ff 上测试。

abc a:nth-child(2) {
text-weight:bold !important;
}

score 1 · Accepted Answer

您对 css 规则有疑问。把它写成

   .abc a:nth-child(2) {
    font-weight:bold !important;
    }

并实现您想要的效果，将您的 CSS 更改为

    a.abc {
    font-weight:bold!important;
    }
.def{
    font-weight:normal!important;
    }

score 0 · Accepted Answer

当您以 nth-child css 为目标时，您必须将条形文本放在 span coz 中，您必须显示相同的标签，我已经创建了两个示例检查这个小提琴http://jsfiddle.net/sarfarazdesigner/ShRnY/

并使用下面的代码

.abc :nth-child(2) {
    font-weight:bold;
}

<a class="abc">
     <span class="def">foo</span>
     <span>bar</span>
   </a>

score 0 · Accepted Answer

你可以做一个技巧来做到这一点。

.abc
{
  font-weight:bold;
}
.def{

font-weight:normal;
}

HTML

<a class="abc">
     <span class="def">foo</span>
     bar
</a>

检查这个小提琴

score -1 · Accepted Answer

-1

现在试试这个

.abc:nth-child(2) {
font-weight:bold !important;
}

于 2012-12-06T07:16:41.680 回答

4 回答 4