使用CSS自定义列表项的项目符号

问题描述

是否可以更改<li>元素的子弹的大小?

Is it possible to change the size of an <li> element's bullet?

看看下面的代码:

li {
    list-style: square; // I want to change the size of this squared bullet.
}

我似乎找不到任何方法来实现这一目标.

I can't seem to find any way to achieve that.

推荐答案

我认为您是要更改子弹的大小?我相信这与li标签的字体大小有关.因此，您可以扩大LI的字体大小，然后减小其中包含的元素的字体大小.有点糟，添加了额外的标记-但类似:

You mean altering the size of the bullet, I assume? I believe this is tied to the font-size of the li tag. Thus, you can blow up the font-size for the LI, then reduce it for an element contained inside. Kind of sucks to add the extra markup - but something like:

li {font-size:omgHuge;}
li span {font-size:mehNormal;}

或者，您可以为列表项目符号指定图像文件，该图像文件可以根据需要设置大小:

Alternately, you can specify an image file for your list bullets, that could be as big as you want:

ul{
  list-style: square url("38specialPlusP.gif");
 }

请参阅: http://www.w3schools.com/css/css_list.asp

这篇关于使用CSS自定义列表项的项目符号的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！