我是网络编程新手,开始阅读如何在CSS中正确使用选择器。我真的需要这个,因为我正在开发一个博客,我的目标是以更有效的方式定位一个范围内的几个段落!为了简化问题,我做了一个例子,li,我需要帮助从[5-15]中选择最有效的方法li以及为什么!。在我发布这篇文章之前,我阅读了这篇articleitemoneitemtwoitemthreeitemfour(...)这是我的jsfiddle 最佳答案 尝试li:nth-child(n+5):nth-child(-n+15){color:red;}演示:Fiddle
我是网络编程新手,开始阅读如何在CSS中正确使用选择器。我真的需要这个,因为我正在开发一个博客,我的目标是以更有效的方式定位一个范围内的几个段落!为了简化问题,我做了一个例子,li,我需要帮助从[5-15]中选择最有效的方法li以及为什么!。在我发布这篇文章之前,我阅读了这篇articleitemoneitemtwoitemthreeitemfour(...)这是我的jsfiddle 最佳答案 尝试li:nth-child(n+5):nth-child(-n+15){color:red;}演示:Fiddle
似乎cssnth-child没有达到目标,有什么想法吗?jsFiddlesourceHTML:rednonegrayCSS:a:nth-child(1){color:red;}a:nth-child(3){color:gray;} 最佳答案 使用nth-of-type()而不是nth-child(),如果您删除了,它将完美运行tag,因为正如@FritsvanCampen评论的那样,它算作一个childa:nth-of-type(1){color:red;}a:nth-of-type(3){color:gray;}为了更好地理解,请
似乎cssnth-child没有达到目标,有什么想法吗?jsFiddlesourceHTML:rednonegrayCSS:a:nth-child(1){color:red;}a:nth-child(3){color:gray;} 最佳答案 使用nth-of-type()而不是nth-child(),如果您删除了,它将完美运行tag,因为正如@FritsvanCampen评论的那样,它算作一个childa:nth-of-type(1){color:red;}a:nth-of-type(3){color:gray;}为了更好地理解,请
我有以下HTML:QuestionsAnswers我拼命地尝试选择第二个h1元素并为其设置样式“user-show-tab-title”(带有“answers”的元素)但出于某种原因.user-show-tab-title:nth-of-type(1)选择了它们并且.user-show-tab-title:nth-of-type(2)没有选择任何东西。什么给了? 最佳答案 那是因为它们都是h1类型的第一个在一个分区内。nth-of-type仅适用于直系子女关系。另请注意nth相关选择器从1开始,因此要选择第二个,您将使用2,而不是1
我有以下HTML:QuestionsAnswers我拼命地尝试选择第二个h1元素并为其设置样式“user-show-tab-title”(带有“answers”的元素)但出于某种原因.user-show-tab-title:nth-of-type(1)选择了它们并且.user-show-tab-title:nth-of-type(2)没有选择任何东西。什么给了? 最佳答案 那是因为它们都是h1类型的第一个在一个分区内。nth-of-type仅适用于直系子女关系。另请注意nth相关选择器从1开始,因此要选择第二个,您将使用2,而不是1
我有这个代码:*>ulli:nth-child(4n+3){color:red;}12.12.22.32.43在此它选择了2.3和3但我不明白这是怎么发生的。我的想法是:它同时选择相对于父元素处于奇数位置的两个元素。但是2.3真的是第3位还是第7位?我真的卡住了,请帮忙。JSFiddleSample 最佳答案 *>ulli:nth-child(4n+3)首先,这个选择器开头的*>是完全多余的(它告诉浏览器寻找一个ul是其他东西的child;任何东西else。当然,所有ul元素都是;如果不出意外,它们将位于body标记内)。所以你可以
我有这个代码:*>ulli:nth-child(4n+3){color:red;}12.12.22.32.43在此它选择了2.3和3但我不明白这是怎么发生的。我的想法是:它同时选择相对于父元素处于奇数位置的两个元素。但是2.3真的是第3位还是第7位?我真的卡住了,请帮忙。JSFiddleSample 最佳答案 *>ulli:nth-child(4n+3)首先,这个选择器开头的*>是完全多余的(它告诉浏览器寻找一个ul是其他东西的child;任何东西else。当然,所有ul元素都是;如果不出意外,它们将位于body标记内)。所以你可以
我现在有这么长的规则#content#wrappertabletd:nth-child(3),#content#wrappertabletd:nth-child(4),#content#wrappertabletd:nth-child(5){width:30px;}是否可以将nth-child组合成更短的东西,比如nth-child(3,4,5)而不是3行? 最佳答案 这应该可以解决问题:#content#wrappertabletd:nth-child(n+3):nth-child(-n+5){width:30px;}
我现在有这么长的规则#content#wrappertabletd:nth-child(3),#content#wrappertabletd:nth-child(4),#content#wrappertabletd:nth-child(5){width:30px;}是否可以将nth-child组合成更短的东西,比如nth-child(3,4,5)而不是3行? 最佳答案 这应该可以解决问题:#content#wrappertabletd:nth-child(n+3):nth-child(-n+5){width:30px;}