如何增加一里的子弹大小？

发布于 2024-12-06 19:09:46 字数 234 浏览 1 评论 0原文

IE8 中的项目符号太小，我尝试更改字体大小，但没有成功。代码：

<ul style="padding:0; margin:0; margin-left:20px;">
    <li>item 1</li>
    <li>item 2</li>
</ul>

有没有办法在不使用项目符号图像的情况下做到这一点？

原文

The bullets in IE8 are so small, I tried changing the font-size, but that didn't work.
Code:

<ul style="padding:0; margin:0; margin-left:20px;">
    <li>item 1</li>
    <li>item 2</li>
</ul>

Is there any way to do this without using an image for the bullet?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

硬不硬你别怂 2024-12-13 19:09:46

您可以在 IE8 条件注释中执行此操作...

ul {
   list-style: none;
}

ul li:before {
   content: "•";
   font-size: 170%; /* or whatever */
   padding-right: 5px;
}

jsFiddle。

在 IE7 中，您可以通过 JavaScript 在前面添加项目符号并相应地设置其样式。

You could do this in an IE8 conditional comment...

ul {
   list-style: none;
}

ul li:before {
   content: "•";
   font-size: 170%; /* or whatever */
   padding-right: 5px;
}

jsFiddle.

In IE7, you could prepend the bullet via JavaScript and style it accordingly.

回复收藏 0 原文

情徒 2024-12-13 19:09:46

您还可以这样做：

li::marker{
   content:"\25A0";
   font-size: 1.5rem;
   color: black;
   vertical-align: bottom;
}

You can also do:

li::marker{
   content:"\25A0";
   font-size: 1.5rem;
   color: black;
   vertical-align: bottom;
}

回复收藏 0 原文

多彩岁月 2024-12-13 19:09:46

Internet Explorer 似乎并不像 Firefox 和 Chrome 那样原生支持使用 list-style-type 和 font-size 来调整项目符号的大小。我不知道这是否是一个已知问题或错误。

有一些解决方法，但有时图像是最快且更广泛支持的“修复”。

回复收藏 0 原文

最初的梦 2024-12-13 19:09:46

IE8+ 确实会缩放项目符号，但并非针对每种字体大小。
我的修复基于 Verdana 的项目符号比 Arial 的项目符号大这一事实。我使用 css 为 li 设置 Verdana，同时在 li 的内容周围添加额外的跨度以保留原始字体。另外，由于 Verdana 可以使行更高，我可能需要使用行高来弥补这一点，但这取决于浏览器。
另外，我可以使用更大的 li 字体来使项目符号更大，然后我将不得不使用更小的行高。

ul {
    font: 12px Arial;
}
ul li {
    font-family: Verdana;
    line-height: 120%;
} /* font-size: 14px; line-height: 100%; */
ul li span {
    font: 12px Arial;
}

<ul>
    <li><span>item 1</span>
    <li><span>item 2</span>
</ul>

IE8+ does scale the bullets but not for every font size.
My fix is based on the fact the bullets for Verdana are larger than for Arial. I use css to set Verdana for li, at the same time I add extra spans around li's contents to keep the original font. Also, as Verdana can makes the lines higher, I may need to use line-height to make up for that, but that depends on the browser.
Also I can use bigger font size for li to make the bullets even larger, then I'll have to use still smaller line-height.

ul {
    font: 12px Arial;
}
ul li {
    font-family: Verdana;
    line-height: 120%;
} /* font-size: 14px; line-height: 100%; */
ul li span {
    font: 12px Arial;
}

<ul>
    <li><span>item 1</span>
    <li><span>item 2</span>
</ul>

回复收藏 0 原文

~没有更多了~