所有a标签后代的选择器

Question

22

如果这对那些了解 CSS 标签的人来说听起来很基础，我很抱歉。

所涉及的网页有多个部分：

<section id="top"> ; <section id="tab-banner">

在这些部分中，有许多层次嵌套的html。

我只想说抓取每个部分后代的所有<a>标签。例如：

#tab-banner a { /* css here */ }

我该如何提取特定ID元素的后代中所有某一类型（a）的元素？

- Doug Fir

1

如果你只想使用直接的子元素，那么 #tab-banner > a {css here} 就可以了。 - DaniP

@Danko 你能澄清一下吗？如果要选择 #tab-banner 的所有子、孙和曾孙级别的锚点标签，我应该使用 #tab-banner > a 吗？ - Doug Fir

如果你想获取id元素内的所有a标签，那么你发布的选择器必须能够工作。如果只是想获取第一层子元素，请使用 > 符号。 - DaniP

@Danko 嗯，我想知道我还有没有做错其他事情，我会调查一下。你是说#tab-banner a应该选择#tab-banner内所有的a标签吗？ - Doug Fir

嗯，伙计，可能是特定性方面出了一些问题。可能是其他选择器更改了部分内的元素或者使用了 !important。如果您能分享您的URL或fiddle，那就更好了。 - DaniP

3个回答

2

听起来你可能需要使用通用选择器，但我建议你在附加CSS时更具体。星号选择器将样式附加到所有后代元素，但这不是最佳实践，因为它会影响性能。

请查看通用选择器以获取更多帮助。

要了解更多信息，请查看这篇有用的文章：必须记忆的30个CSS选择器。

- Kristian Phillip Hamilton

链接非常有用。 - jefissu

-1

#tab-banner > a { ... }

- cubitouch

3

问题是关于所有后代的。 - Jukka K. Korpela

如果问题没有明确要求“直接”后代选择器，我就不理解这个问题的目的了。 - cubitouch

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Guffa · Accepted Answer

对于所有后代，请使用：

#tab-banner *

对于直系后代，请使用：

#tab-banner > *

由于原帖已更改/澄清问题：

要查找特定类型的所有后代，请使用该类型而不是*。例如：

#tab-banner a

所以，你现在尝试的是正确的。如果样式没有应用到你预期的元素上，那么这些元素实际上不是该部分的后代，或者你有另一条规则具有优先权。