Bullet图像自动调整大小

我使用CSS3格式化。我有用于子弹的过大图像。我希望子弹自动调整为字体的大小。我能做到吗？Bullet图像自动调整大小

如果不是，（该死的）我将如何设置图像子弹特定的大小？（如12的高度，并自动调整的宽度）

ul { 
     list-style-image: url('rectangular_bullet_image.jpg') 
    }

来源

2014-01-20 Evorlor

为什么要使用* large *图像作为列表项目符号？但是如果你希望它可以调整大小，我会建议使用自定义字体或Unicode字符和'li：before'。 – Blazemonger

避免列表式图像 - 它无法控制图像的位置或大小。改为使用CSS背景。 –

小提琴如果你希望它扩展到的高度李，然后使用Mihnea解决方案。

如果你希望它扩展到字体大小，使用

ul li { 
    padding-left: 20%; 
    background: url('rectangular_bullet_image.jpg') no-repeat left top; 
    background-size: auto 1em; 
}

其中最后一个尺寸（1EM）是指字体的大小。所以，如果你想要它比字体略大，设置1.2em

请注意，如果li只有1行，则2种解决方案大致相同。

这对于多行li有不同之处。

来源

2014-01-20 21:18:03 vals

尝试这样的事情

ul { 
    list-style-type: none; 
    padding: 0; 
} 

ul li { 
    padding-left: 20%; 

    background: url('rectangular_bullet_image.jpg') no-repeat left top; 
    background-size: 20% 100%; 
}

继承人与它http://jsfiddle.net/YUjdz/1/

来源

2014-01-20 20:33:38

Bullet图像自动调整大小

回答

相关问题