html - 使用 css 从递归结构中选择 ul li 列表中的最后一个元素 gg

标签 html css

我想用 css 选择 child 的最后一个 <li>该文本出现gg 我只想选择 Last gg <li>请帮忙

ul {
  margin: 0;
  padding: 0;
}
.container ul li + li:nth-last-child(1) li:last-child {
  border: 1px solid red
}
<div class="container">
  <ul class="ng-scope">
    <li>
      <ul>
        <li>a</li>
      </ul>
    </li>

    <li>
      aa
      <ul>
        <li>
          bb
          <ul>
            <li>
              cc
              <ul>
                <li>
                  dd
                  <ul>
                    <li>
                      ee
                      <ul>
                        <li>
                          ff
                          <ul>
                            <li>
                              gg
                            </li>
                          </ul>
                        </li>

                      </ul>
                    </li>

                  </ul>
                </li>

              </ul>
            </li>

          </ul>
        </li>
      </ul>
    </li>
  </ul>
</div>

最佳答案

试试这个

ul { margin:0; padding:0;}
.gg{

color:red;

}
<div class="container">
    <ul class="ng-scope">
        <li>
            <ul>
				<li>a</li>
            </ul>
        </li>

        <li>
            aa
            <ul>
                <li>
                    bb
                    <ul>
                        <li>
                            cc
                            <ul>
                                <li>
                                    dd
                                    <ul>
                                        <li>
                                            ee
                                            <ul>
                                                <li>
                                                    ff
                                                    <ul>
                                                        <li class="gg">
                                                            gg
                                                        </li>
                                                    </ul>
                                                </li>

                                            </ul>
                                        </li>

                                    </ul>
                                </li>

                            </ul>
                        </li>

                    </ul>
                </li>
            </ul>
        </li>
    </ul>
</div>

关于html - 使用 css 从递归结构中选择 ul li 列表中的最后一个元素 gg,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38804067/

相关文章:

html - CSS/Bootstrap div 布局问题

javascript - jquery animate() - 如何只移动/动画页面的一部分?

css - bootstrap-sass 2.3.2 与 Rails 4.0.0 : issue @extend . 控制组; &@extend.error;

javascript - 在导航栏中滚动(Bootstrap 3),但保持页面的其余部分不变

html - 与文本左侧的图像链接

javascript - 获取 html 页面中嵌入 kibana 图表中时间戳的引用

javascript - HTML 按钮突出显示 Jquery 不起作用

html - 为什么显示: inline-block; remove an underline from a child element?

javascript - 统一 div,以便调整窗口大小不会将它们分开

html - 有哪些好的解决方法可以解决 Mozilla Firefox 中的 "Visiblility: Collapse"错误?