The :last-of-type CSS pseudo-class represents the last element of its type among a group of sibling elements. CSS伪类:last-of-type代表在一群兄弟元素中的最后一个指定类型的元素。 听起来可行,试试: // css.p{display:block;margin:10px0;border-bottom:1px solid #000;}.p:last-of-type{border...
The :last-of-type CSS pseudo-class represents the last element of its type among a group of sibling elements.
如下代码所示,要对class值为children的第一个和最后一个背景色单独设置,为什么first-of-type有效果,last-of-type不起作用呢? 1 2 3 4 5 就是不一样 .children{ display:inline-block; width:50px; height:50px; background:gray; &:first-of-type{ background:pink; } &:last-of-type { backgroun...
:last-of-type 关于:last-of-type手册中是这么解释的: The:last-of-typeCSS pseudo-class represents the last element of its type among a group of sibling elements. CSS伪类:last-of-type代表在一群兄弟元素中的最后一个指定类型的元素。 直接用上面两个栗子。 <!DOCTYPE html>p { border-bottom: 1px...
讨论一下:last-child与:last-of-type之间的区别，和使用场景。加强记忆。工具/原料 sublime 浏览器 背景 1 在做列表的时候，会经常遇到最后一个元素与其他元素在样式上会有差异的情况。如果是单纯的静态页面，可以使用class去控制。也可以在页面渲染结束之后，使用js去控制。若对于兼容性的要求并非那么严格，可以使用...
:last-child 和 :last-of-type 作为CSS常用伪类选择器,:last-child经常会被用到; 但有时遇到极端情况,它会意外失效,让人摸不着头脑,例子如下: html: 1234567next is ... css: .card{color:white;> p { &:last-child { border: 5px solid pink; }} } 结果: 看到是不生效的,但是使用...
someselector:last-of-type不仅与someselector这个选择器相关,还与符合该选择器的元素的标签相关。 再看一下W3C的说明: The :last-of-type pseudo-class represents an element that is the last sibling of its type in the list of children of its parent element. ...
<!DOCTYPE html> .p:last-of-type { background:#ff0000; } 这是标题 这是第一个段落。 这是第二个段落。 这是第三个段落。 这是第四个段落。 11 对类名.p.last-of-type不起作用,换成p.last-of-type就好了,为什么对类名不起作用?css 有用1关注7收藏1 回复 阅读13.5k 5 个回答...
以前一直以为.p:last-of-type是匹配到.p的父元素内的最后一个子.p元素。直到最近使用后发现不生效,认真去查相关用法后才发现:‘漏’!‘大漏特漏’!! 正确释义或用法(自己理解,仅供参考): 这是一个p标签 with class 'p' .p:last-of-type,是匹配到 (1).test中的最后一个.p...
<!-- First fragment --> The first P inside the note. <!-- Second fragment --> Note The first P inside the note. 標準資訊您可以在 CSS Selectors Level 3 (CSS 選取器層級 3) 找到此虛擬類別的定義。適用範圍a , abbr , acronym , address , b , big , blockquote , body ...