如何控制 html 无序列表的样式？答案

【问题标题】：How do I control the styling of an html unordered list?如何控制 html 无序列表的样式？
【发布时间】：2010-10-16 22:24:09
【问题描述】：

谁想到给链接列表设置样式会这么麻烦！

第一个问题我想使用任意字符作为项目符号。我是现在确定这是不可能的，但是也许你知道不同？
无论如何我都想控制子弹与
内容之间的距离。
我想控制项目符号的高度（因此无论字体/大小等如何，它都保持在
中文本的中心）。
我希望子弹留在包含

标签： css cross-browser styling

【解决方案1】：

http://css.maxdesign.com.au/listamatic/

【讨论】：

【解决方案2】：

首先，请确保您使用 CSS 移除列表元素的填充/边距，这样您就可以为所有浏览器拥有一个干净的状态。然后，如果您总是希望子弹图像居中，请使用图像。

 ul{
   margin: 0;
   padding: 0;
}

ul li{
  padding: 0 0 0 20px; /*so text does not appear on top of bullet */
  background: url(error.gif) no-repeat 0 50%; /* this will set the bullet to appear in the middle */
}

【讨论】：

我同意。最好的方法是使用背景图片，尝试自己设置点的样式太难了。

【解决方案3】：

对于无序列表，您必须制作一个图形来显示任意字符。其他可用值是：

list-style-type: disc | circle | square | none

要使项目符号停留在文本中而不是悬空，请使用

list-style-position: inside

？？？不确定您在最后一点中所说的“环绕”是什么意思。

【讨论】：