Question

有一个奇怪的问题：

在我的.cshtml中我还有第二件事：

<ul>
    <li>Test</li>
    <li>Test2
        <ul>
            <li>Test3</li>
        </ul>
    </li>
    <li>Test4
        <ul>
            <li>Test5</li>
        </ul>
        <ul>
            <li>Test6</li>
        </ul>
    </li>
</ul>

这应该是这样的：

Test
Test2
     Test3
Test4
     Test5
     Test6

但是而不是它，它的工作原理如下：

Test
Test2
Test3
Test4
Test5
Test6

我在css中唯一拥有的就是list-style: none; 此外，<ul>主<div>位于text-align: left;内，其中function select_users_to_send($product_id){ $type = get_product_type($product_id) return $type.' user'; }（没有它，所有项目都居中）。

我是一个新手谈论css所以，我无法得到，我缺少的。

修改忘了一件事。这在jsfiddle中工作正常。

Answer 1

只需重置所有样式并提供</li>即可。您仅使用<li>来打开和关闭它：

＆＃13;

<ul>
  <li>Test</li>
  <li>Test2
    <ul>
      <li>Test3</li>
    </ul>
  </li>
  <li>Test4
    <ul>
      <li>Test5</li>
    </ul>
    <ul>
      <li>Test6</li>
    </ul>
  </li>
</ul>

＆＃13;

你的错误

<ul>
    <li>Test<li> <!-- Should be </li> not <li> -->
    <li>Test2
        <ul>
            <li>Test3</li>
        </ul>
    <li><!-- Should be </li> not <li> -->
    <li>Test4
        <ul>
            <li>Test5</li>
        </ul>
        <ul>
            <li>Test6</li>
        </ul>
    <li><!-- Should be </li> not <li> -->
</ul>

预览

Answer 2

请检查一下......

或

提供您使用过的 CSS ..

div { text-align: left; } ul { list-style: none; }

<div> <ul> <li>Test</li> <li>Test2 <ul> <li>Test3</li> </ul> </li> <li>Test4 <ul> <li>Test5</li> </ul> <ul> <li>Test6</li> </ul> </li> </ul> </div>

Answer 3

我想出的解决方案是你应该使用具有类名的div标签包装你的无序列表。例如 <div class="test"></div>

<强> HTML：

<div class="test">
    <ul>
        <li>Test</li>
        <li>Test2
            <ul>
                <li>Test3</li>
            </ul>
        </li>
        <li>Test4
            <ul>
                <li>Test5</li>
            </ul>
            <ul>
                <li>Test6</li>
            </ul>
        </li>
    </ul>
</div>

<强> CSS

.test ul li {
    list-style: none;
    text-align: left; 
}

Answer 4

我想这可能是你的问题。

padding:0px;
margin:0px;

ul li ul
{
    padding:0px;
}

<ul>
    <li>Test</li>
    <li>Test2
        <ul>
            <li>Test3</li>
        </ul>
    </li>
    <li>Test4
        <ul>
            <li>Test5</li>
        </ul>
        <ul>
            <li>Test6</li>
        </ul>
    </li>
</ul>

<强> ANSWER

注意：请从ul CSS中移除填充属性。

ul li ul
{
   /* padding:0px; REMOVE IT If It's 0PX' */
}

<ul>
    <li>Test</li>
    <li>Test2
        <ul>
            <li>Test3</li>
        </ul>
    </li>
    <li>Test4
        <ul>
            <li>Test5</li>
        </ul>
        <ul>
            <li>Test6</li>
        </ul>
    </li>
</ul>

ul li css无法正常工作

4 个答案: