0

私はhtml、cssを使用して構築されたツリーを持っています。ツリーの最後のノードを非表示にする必要があります。私のcssコードは次のとおりです。

div ul li ul li ul li ul.treeview{ display: none; }

動作しませんでしたが、問題は何ですか?

マークアップ:

<div id="field-term-parent-value-wrapper" class="form-item form-item-labeled">
    <div id="field-term-parent-value" class="tm-processed">
<ul class="treeview">
<li class="collapsable">
<ul class="treeview" style="display: block;">
<li class="collapsable">
<ul class="treeview" style="display: block;">
  data
4

2 に答える 2

2

試す：

div ul li ul li ul li ul.treeview { display: none !important; }

要素のインライン スタイルは、この要素に定義されている他のスタイルをオーバーライドするためです。

PS私はあなたがあなたのマークアップを知っていて、CSS宣言に正しい数ulとを入れたと仮定します。liあなたが貼り付けたものは、そこに3ulつと2つしかないことを示唆しているliので、これはうまくいくでしょう:

div ul li ul li ul.treeview { display: none !important; }
于 2012-12-25T13:05:47.410 に答える
0

これらの状況で機能するのは、「display: block」を直接設定するのではなく、クラス名を切り替えることです。これにより、クレイジーなセレクターや !important を使用する必要がなくなります。

/* the default is display:block, so all we need
   is this one class */

.closed {
    display: none;
}

<li class="collapsable">
<ul class="treeview">
<li class="collapsable">
<ul class="treeview" class="closed">
于 2012-12-25T13:17:42.223 に答える