草庐IT

first-child

全部标签

html - 最后一个 child 的行为

为什么最后一个p没有突出显示?w3schools说:Specifyabackgroundcolorforthepelementthatisthelastchildofitsparent所以最后一个p应该突出显示吧?divp:last-child{background:#ff0000;}Thefirstparagraph.Thesecondparagraph.Thethirdparagraph.Thefourthparagraph.Thefirstspan.对于你来说,使用这个-这不是我的问题:divp:last-of-type{...} 最佳答案

html - 选择 nth-child 跳过隐藏元素

这个问题在这里已经有了答案:CanIcombine:nth-child()or:nth-of-type()withanarbitraryselector?(8个答案)关闭7年前。我正在寻找一种仅使用CSS(无JS)的方法来忽略第n个子项计数中的隐藏元素。这可能吗?我有这个HTML:我试图定位非空的第二个画廊元素,但这不起作用:.gallery-item:not(.empty):nth-child(2n){}我不想使用JS,因为这是一个有很多断点的复杂站点,我不想为这种基本的东西添加onresize监听器。

javascript - 切换子菜单,如果 child 点击转到页面

我构建了一个简单的切换菜单,点击一次会显示子元素列表,再次点击会隐藏这些可见元素。如果单击一个子元素,但我希望它只访问该页面,我似乎无法让它工作?跟我防止Default有关系吗?//Languageselectinglobalnav$('.sub-lang').on('click',function(e){if($(this).hasClass('active')&&$(e.target).parent().hasClass('active')){$(this).removeClass('active');$(this).css('height','auto');$(this).chi

html - 如何使用 CSS first-child 但不包括文本内容

此代码段无法按我预期的方式工作:divlispan:first-child{font-weight:bold;}ThisisatestAndthisisalsoatest两者都是span元素是粗体。我原以为第二个不是粗体,因为它遵循明文"And",但我猜:first-child不将文本内容视为子内容。有没有办法区分这两种情况,并选择前面没有任何内容或sibling的元素?澄清一下:在我的具体情况下,我想制作一个每个元素元素粗体,但前提是它位于的开头并且前面没有任何文本或其他元素。 最佳答案 据我所知,不,您不能仅使用CSS来区分带有

html - 你如何告诉浏览器 "if you need to wrap, wrap here first"?

我正在制作一个网页,其中的标题有一个主要主题和一个描述符,每个都包含在标签中。我已经查找了标签,它似乎只在你有长字符串时才有效没有空格。但是我在文本中断断续续地有空格。我需要的是我可以在两个元素或字符之间插入一些东西,告诉浏览器如果给定以下代码:Howdoyoutellabrowser,"ifyouneedtowrap,wrapherefirst"渲染这个:Howdoyoutellabrowser,"ifyoutowrap,wrapherefirst"?但是如果没有足够的空间,首先在元素之间拆分,给出:Howdoyoutellabrowser,"ifyouneedtowrap,wrap

html - CSS Grid 在设置 grid-row 时不会包裹 child

CODEPEN背景:我正在尝试使用GridCSS并尝试实现目前实现的这种布局预期布局问题:在桌面上,元素标题应为8列宽,如果我不将网格行添加到element-header和element比1将在element-header旁边填写.现在,如果我添加grid-rows我的element将不再换行。当前布局(问题)问题如何修复我的网格以匹配上面的“预期布局”屏幕截图?即.element将换行并从第二个网格行开始代码:HTML:Iamalotofheadertextthatonlygoes8columsnwide1234CSS:.section{width:100%;display:bloc

html - 如何考虑 :nth-child 的 child

我有一些简单的htmlrow1row2row3row4.1row4.2.1row4.2.2row4.3row4.4row5和css文件div:nth-child(even){background-color:green;}我想让所有奇数行都变成绿色并且不考虑层次结构。但结果我有这个我做错了什么?如何制作绿色行2、4.1、4.2.2和4.4。所有其他的都应该是白色的。是否可以不用javascript只用css? 最佳答案 基本上,不,这是不可能的。CSS不能通过计算文档中的元素来工作。它将文档视为一棵树,您不能以任何其他方式对待它。您

html - CSS::before 是 nullifying::first-letter

HTML代码:ExampletitleCSS:h1::first-letter{display:none;}h1::before{content:url(http://icons.iconarchive.com/icons/ariil/alphabet/32/Letter-E-icon.png);}我的问题是:为什么::before会取消::first-letter规则?这里发生了什么?如果::before被删除,::first-letter工作正常。在不更改html的情况下,是否有任何替代方法可以针对此示例中的第一个字母?http://jsfiddle.net/Borachio/kv

jquery - 使用 jquery 将类添加到 nth-child

我正在尝试使用jquery向第n个子级添加一个类,以便它可以在IE中运行。它似乎没有用,我遵循了几个没有结果的例子。我已经链接了fiddlehttp://jsfiddle.net/aosto/XghbU/NumberDescriptionStartDateDueDateEdit/ViewComplete$(document).ready(function(){$('.listitem:nth-child(2)').addClass("listitem2");}); 最佳答案 您的选择器应该如下所示,以便在列表标签​​内找到您的第二个

html - z-index 和堆叠;从堆叠上下文中删除一个 child

我正在尝试调整某些元素的堆叠顺序;这是一个SSCCE。给定这个HTML片段:Loremipsumdolor.Widgetygoodness!Loremipsumdolor.Loremipsumdolor.我正在尝试在#block2之上显示#widget;使用以下CSS,您会发现在不更改节点树中#widget的位置的情况下存在问题。#block1,#block2,#block3{position:relative;min-height:50px;width:100%;}#block1,#block3{background-color:#abc;color:#123;z-index:1;}