在中的元素的自定义子弹符号，这是一个普通字符，而不是一个图像

I realize one can specify a custom graphic to be a replacement bullet character, using CSS attribute:

我知道可以使用CSS属性将自定义图形指定为替换的子弹字符:

list-style-image

And then giving it a URL.

然后给它一个URL。

However, in my case, I just want to use the '+' symbol. I don't want to have to create a graphic for that and then point to it. I'd rather just instruct the unordered list to use a plus symbol as the bullet symbol.

但是，在我的例子中，我只想使用“+”符号。我不想为它创建一个图形，然后指向它。我宁愿指示无序列表使用加号作为子弹符号。

Can this be done or am I forced to make it a graphic first?

可以这样做吗?还是我必须先把它画成一个图形?

13 个解决方案

#1

The following is quoted from Taming Lists:

以下引用自驯服清单:

There may be times when you have a list, but you don’t want any bullets, or you want to use some other character in place of the bullet. Again, CSS provides a straightforward solution. Simply add list-style: none; to your rule and force the LIs to display with hanging indents. The rule will look something like this:

有时你有一个列表，但你不想要任何子弹，或者你想用其他字符代替子弹。同样，CSS提供了一个简单的解决方案。只需添加list-style:没有;按照您的规则，强制LIs显示与悬挂缩进。规则是这样的:
ul {
   list-style: none;
   margin-left: 0;
   padding-left: 1em;
   text-indent: -1em;
}
Either the padding or the margin needs to be set to zero, with the other one set to 1em. Depending on the “bullet” that you choose, you may need to modify this value. The negative text-indent causes the first line to be moved to the left by that amount, creating a hanging indent.

填充或边距需要设置为0，另一个设置为1em。根据您选择的“项目”，您可能需要修改这个值。负的文本缩进将第一行移动到左边，并创建一个挂起的缩进。

The HTML will contain our standard UL, but with whatever character or HTML entity that you want to use in place of the bullet preceding the content of the list item. In our case we'll be using », the right double angle quote: ».

HTML将包含我们的标准UL，但是要使用任何字符或HTML实体来替代列表项内容前面的项目符号。在我们的例子中，我们将使用»，正确的双角引号:»。

» Item 1
» Item 2
» Item 3
» Item 4
» Item 5 we'll make
a bit longer so that
it will wrap

»项目1»项目2»项目3»项目4»项目5我们会做得更长一点，这样它就可以包装了

13 个解决方案

#1

更多相关文章

随机推荐