html - ネストされたリストを木のようにレンダリングする

Question

最後の要素でこのストップの垂直境界線を作成するにはどうすればよいですか?

CSS3/モダンブラウザ対応のみ可能です。ただし、さまざまな背景で作業する必要があります (つまり、透明にする必要があります)。

これから：

不要リスト

これに：

指名手配リスト

score 7 · Accepted Answer

このフィドルのcssを変更することでこれを解決しました：

score 2 · Accepted Answer

:last-child次のように CSS 疑似クラスを使用して、最後のリスト項目を選択できます。

ul li:last-child {
    height: 0.7em;
}

高さを 0.7em に設定すると、左の境界線の尾が切り落とされてうまくいったようです。フィドルにネストされたグループをいくつか追加して、コンテンツが変更され、ネストされたグループが追加された場合でも機能することを示しました。

2 に答える 2