Question

有没有办法使用CSS增加子弹列表样式类型的大小？我不想增加项目符号文本的大小，只需增加项目符号类型。我也不能使用图像或JavaScript。它必须是我可以嵌入<style>标记内<head>标记内的内容。

Answer 1

可能无法在旧版本的IE中使用。

li:before{ content:'\00b7'; font-size:100px; }

Demo

对于IE6：

如果没有javascript或图片，我建议在每个列表项的开头添加<span>·</span>并设置样式。

Answer 2

我不得不做类似的事情。我的方法是在li：

中的文本周围添加span标记

<li><span>Item 1</span></li>
<li><span>Item 1</span></li>

然后你可以增加你的字体大小并缩小你的字体大小：

li {
  font-size: 20px;
}
li span {
  font-size: 14px;
}

您可能需要调整线高和边距以适应额外的尺寸。但是这种方法还允许您为与文本分开的项目符号着色。

Answer 3

当您说您无法使用图片时，您是说您无法编辑li标签来添加图片，或者您根本无法使用图片？

在li元素上，您可以设置list-style-image属性。

li {
 list-style-image: url('/imagepath.png');
}

如果不编辑列表标记，这仍然可以放在头标记中。

Answer 4

我不知道。

但你可以使用：之前

伪造它

ul,li{list-style:none;}
li:before{content:"o";font-weight:bold;}

Answer 5

为（ex：.menu li a）标签添加任何背景颜色，并添加填充，您将得到一个框然后是border-radius，然后为（.menu li）应用左右填充填充。 ..（以相反的顺序解释）

#header .nav-primary ul li{float:left;display:block;margin:0;padding:0 22px;}
#header .nav-primary ul li a{text-decoration:none;color:#030;background:#CBCBCB;border-radius:5px;padding:5px 0px;}

Answer 6

正在寻找解决方案，并发现如果你在li里面嵌入一个p，你可以分别设置子弹和子弹文本的样式。

<div>
  <ul>
    <li><p>Hello</p></li>
  </ul>
</div

div ul li {
 /*this will style the bullets*/
}

div ul li p {
/*this will style the text*/
}

Answer 7

要增加子弹的大小，您可以使用

li::marker 
{
    font-size: 2rem;
    font-weight: bolder;
}

并更改项目符号，内容属性将起作用

li::marker 
{
    content: '\2746'
    font-size: 2rem;
    font-weight: bolder;
}

增加list-style-bullet类型的大小

7 个答案: