0

你好,今晚我花了大约 4 个小时在这上面,我不得不放弃我所有的头发。我尽量不问足够简单的 css 问题,但我无法掌握列表项或更具体的子列表项。我发现的所有规则。

<li class="parent open">
<span class="parent open"></span>
<a href="/member-tags/forum">Member Tags</a>
<ul>
<li class="parent open">
<span class="parent open"></span>
<a href="/world-komp/forum">world of komp</a>
<ul>
<li>
<a href="/komps-bets/forum">komps bets</a>
</li>
<li>
<a href="/komps-daily-diary/forum">komps daily diary</a>
</li>
...

我想让我的子项目的缩进更小,并且文本也更小以适应它们。这是一个屏幕截图。左边的黑色东西应该是箭头,指示我希望我的孩子物品在哪里。 在此处输入图像描述

您可以在我的网站 http://onlinebanter.com上查看代码

感谢所有帮助,因为我真的花了太多时间试图弄清楚这一点,这不是我尝试的第一个晚上。

谢谢

ul.jquerymenu li.parent {
  background-image:none;
  list-style:none none;
}
.block ul {
  margin:0;
  padding:0 0 0.25em 1em;
}

ul.menu {
  border:none;
  list-style:none;
  text-align:left;
}

ul {
  list-style-type:disc;
}
.block ul, .block ol {
  margin-left:2em;
  padding:0;
}

ul, ol, dd {
  margin-bottom:1.5em;
  margin-left:2em;
}

ul.menu li {
  margin:0 0 0 0.5em;
}

li, li.leaf, ul.menu li, .item-list ul li {
  line-height:150%;
}

ul.menu li, ul.links li {
  margin:0;
  padding:0;
}

ul.jquerymenu li.parent {
  background-image:none;
  list-style:none none;
}

ul.menu li {
  margin:0 0 0 0.5em;
}

li, li.leaf, ul.menu li, .item-list ul li {
  line-height:150%;
}

ul.menu li, ul.links li {
  margin:0;
  padding:0;
}
4

2 回答 2

2

您的 HTML 如下所示:

<ul>
  <li>...
  <ul>
    <li>....

应用以下CSS:

ul {
  margin-left: 2em;
}

只需将值更改为1em,缩进就会减少。

于 2012-12-04T01:58:41.543 回答
1

在您的特定情况下,您可以使用 selector .parent .parent ul,如下所示:

.parent .parent ul {
margin-left: 1em;
font-size: 10pt;
}

.parent .parent ul 找到一个 ul 元素,它是具有父类的元素的子元素,该元素又是具有父类的另一个元素的子元素。像这样:

<tag class="parent">
  <tag class="parent">
  </tag>
</tag>

在该示例中,在具有父类的元素(标签)内部存在一个具有父类的元素(标签)。所以CSS可能是.parent .parent { ... }

现在,在其中放置一个 UL 元素:

<tag class="parent">
  <tag class="parent">
     <ul>
     </ul>
  </tag>
</tag>

现在 CSS 选择器可以是.parent .parent ul { ... }

希望有帮助。

于 2012-12-04T02:00:43.357 回答