[分享]css单独控制li的最后一行

 CSS 单独控制 li 的最后一行在网页设计中，列表元素（li）是我们常用的元素之一，用来排版各种内容。但是，在某些情况下，我们需要单独控制列表中最后一行的样式，这时候就可以使用 CSS。CSS 有...

 CSS 单独控制 li 的最后一行
在网页设计中，列表元素（li）是我们常用的元素之一，用来排版各种内容。但是，在某些情况下，我们需要单独控制列表中最后一行的样式，这时候就可以使用 CSS。
CSS 有一种伪类选择器叫做 `:last-child`，它可以选择在一个父级元素下的最后一个子元素。但是，如果列表的行数不确定，我们就无法通过 `:last-child` 来选择最后一行。这个时候，我们需要使用另外一种伪类选择器，它就是 `:last-of-type`。
`:last-of-type` 选择器用来选择某个元素在其父级元素下的最后一种类型。例如，如果我们有一个菜单列表，其中包含带有链接的 li，还有一些带有类别标题的 h2 标题，那么 `:last-of-type` 将仅选择最后一个 li，而不管它是出现在 h2 标题后面还是前面。
下面是 CSS 代码，通过 `:last-of-type` 选择器选择最后一行：

.container li:last-of-type {
  border-bottom: none;
} 

这段代码将选择容器（.container）内的最后一个 li 元素，然后设置其下边框为 none。这个技巧对于一些特殊的设计需求非常有用，例如，在列表中添加分隔线时，最后一行不需要分隔线，这时候我们就可以使用这种技巧。