html - 如何使两个 ul li 元素内联？

Question

我的页面中有这个 ul 元素:

            <ul class="nav pull-left" style="width: 90px; list-style-type: none;margin: 0; padding: 0;">             
                <li><a href="#" style="display: inline-block;text-align: center;"><i class="glyphicon glyphicon-tree-conifer"></i> <br> sites</a></li>
                <li><a href="#" style="display: inline-block;text-align: center;"><i class="glyphicon glyphicon-tree-conifer"></i> <br> events</a></li>         
            </ul>

这是它的样子:

我需要更改上面的外观并使两个元素内联:

我试过这个 example .但我没有得到想要的结果。如何使元素内联？

Answer 1

您已将“display:inline-block”样式应用于 <A>标签，而不是 <LI>标签。将它切换到 LI 标签，它对您来说应该是正确的。

此外，您可能应该尽量避免像这样将样式直接放在标签上，而是使用附加的样式表。想象一下，您必须更改其中的 30 个，那将是一个巨大的痛苦。如果您有样式表，则只需更改一小行。