7

我想在我的水平列表中显示光盘项目符号。

我知道一旦我们在 CSS:display: inline;中定义，类定义：list-style-type: disc就不起作用了。

所以这一直是我的解决方案：

                <ul>
                    <li>· EN</li>
                    <li>· ES</li>
                    <li>· ES</li>
                    <li>· DE</li>
                    <li>· FR</li>
                </ul>

我已经手动将符号圆盘项目符号点放在我的水平列表中，然后我在我的头部声明了这一点：<meta http-equiv="content-type" content="text/html;charset=utf-8" />.

在我的 coda 编辑器预览中，它们看起来不错，但如果我尝试浏览它，我会得到 - 这个。

为什么？我怎样才能找出问题所在？否则，在水平列表中显示光盘项目符号的最佳解决方案是什么？

4

3 回答 3

16

您可以将它们保留为块并执行以下操作，而不是display:inline为您选择：li

li {
    float:left; 
}

然后，您可以根据需要调整边距。

于 2012-11-08T15:20:52.327 回答
5

试试display:inline-block

CSS

ul li{
    display:inline-block;
}

在 IE6 和 IE7 中工作：

CSS

ul li{
    display:inline-block;
    zoom:1;
}
于 2012-11-08T15:21:22.113 回答
2

你方法的问题是双重的。首先，您使用的字符“·”不是子弹；它是具有多种用途的中间点，主要用作文本中的分隔符。BULLET “•”字符更合适。其次，您声明了 UTF-8，这很好，但是您的文档实际上需要进行 UTF-8 编码，而且显然是（相反，从这里看，它可能是 windows-1252 编码的）。

但作为不需要解决编码问题的快速解决方案，您可以使用实体引用编写 BULLET &bull;，例如<li>&bull;&nbsp;EN</li>.

当然还有其他方法。但是如果你设置display: inline了 ，那么浏览器将不会生成项目符号，因为它们只会对display: list-item. 您需要将项目符号包含到元素内容中，或者使用生成的内容（使用:before伪元素）。

于 2012-11-08T17:04:20.010 回答