CSS

Question

我的网页中的ul和li根本不起作用。这是我的index.html

<div id="main" class="core">
    <div id="background">       
    </div>
    <div id="content">
        <div id="default"><div></div></div>
    </div>
    <div id="map" class="special"></div>

</div>

这是我的page.php

// Care for the Square
case 'care-for-the-square':
    echo '
    <p>On an annual basis the Friends fund: </p>
    <ul id="test">
    <li>Landscaping</li>
    <li>Tree care</li>
    <li>Grass seeding</li>
    <li>Graffiti removal</li>
    <li>Bench repair</li>
    <li>Supplemental seasonal maintenance staff</li>
    <li>Sidewalk sweeing</li>
    <li>A dedicated park ranger</li>
    <li>Excess seasonal trash removal</li>
    <li>Holiday lights</li>
    <li>Doggie bags</li>
    </ul><br/>

    ';
    break;

谁能帮助我解决这个问题？谢谢

Answer 1

如果子弹不在页面上，最可能的原因是你的CSS设置你的ul / li

list-style: none;

我创建了一个展示其工作原理的示例Example。很多网站都会有一个reset.css，可能会被称为其他网站，这就是为什么这些网站不会出现“默认”的原因。如果您提供更多信息，例如您的CSS，社区可能会进一步提供帮助。

Answer 2

可能ul设置为list-style: none，但子弹消失的可能性更大，因为默认的左边距和/或填充已被删除。如上所述，您还需要发布您的CSS，或者最好是演示此问题的工作示例。

编辑：在normalize.css，第270行，你有这个规则：

menu, ol, ul, li {
    padding: 0;
    list-style: none;
}

这隐藏了你的要点。您可以删除第二个列表项规则，也可以使用以下命令覆盖它：

#test li {list-style: disc;}

Answer 3

添加此css ...

CSS

ul#test li {
    margin-left:10px;
    list-style:disc;    
}

CSS ul li bullet消失了

3 个答案:

CSS