列表样式图像没有显示图标

我是新来的HTML和CSS，我想列出名为pie_bullet.png的图像的项目。有很多嵌套列表，我无法使它工作。任何人都可以帮助我吗？
我想用css与图片列表中的项目是这两类列表样式图像没有显示图标

<ul type="a"> 
 
    <li>preheat Oven: preheat oven to 350 degrees F(175 degrees C).</li> 
 
    <li>Make Lemon Filling: In a medium saucepan ...</li> 
 
    <ul class="first"> 
 
    <li>Whisk together 1 cup sugar, flour, cornstarch, and salt.</li> 
 
    <li>Stir in water, lemon juice and lemon zest.</li> 
 
    <li>Cook over medium-high heat, stirring frequently, until mixture comes to a boil.</li> 
 
    <li>Stir in butter.</li> 
 
    <li>Place egg yolks in a small bowl and gradually whisk in 1/2 cup of hot sugar mixture.</li> 
 
    <li>Whisk egg yolk mixture back into remaining sugar mixture.</li> 
 
    <li>Bring to a boil and continue to cook while stirring constantly until thick.</li> 
 
    <li>Remove from heat.</li> 
 
    <li>Pour filling into baked pastry shell.</li> 
 
    </ul> 
 
    <li>Make Meringue: In a large glass or metal bowl ...</li> 
 
    <ul class="second"> 
 
    <li>Whip egg whites until foamy.</li> 
 
    <li>Add sugar gradually, and continue to whip until stiff peaks form.</li> 
 
    <li>Spread meringue over pie, sealing the edges at the crust.</li> 
 
    </ul> 
 
    <li>Bake: Bake in preheated oven for 10 minutes, or until meringue is golden brown</li> 
 
</ul>

来源

2017-06-15 Rawi Sader

你应该张贴您的HTML代码示例以及您的帖子。你不会期望人们通过外部链接 –

我只是添加了一个片段，谢谢你的建议！ –

列表项“李”将图像添加到列表：

<ul> 
<li><img src="path to file.png" alt="quick description"></li> 
</ul>

来源

2017-06-15 19:13:47

如果您将代码作为文本发布，这会非常有帮助。这样我们可以看到所有这些，并帮助编辑。

试试下面的CSS：

ul { 
    list-style-image: url('sqpurple.gif'); 
}

希望这有助于！

编辑：基于您发布的代码，以下CSS的工作原理：

.first li { 
list-style-image: url("icon.png");

来源

2017-06-15 19:14:17

我发布了你告诉我的代码，谢谢你的建议！我试过你做的，但我做错了..它不起作用 –

检查出https://jsfiddle.net/qyo3outp/ –

而是UL类的此方法添加到黎类

li { 
 
    list-style:none; 
 
    background-image: url("http://www.icone-png.com/png/7/7359.png"); 
 
\t background-repeat: no-repeat; 
 
\t background-position: left center; 
 
\t background-size: 40px; 
 
    padding:10px 0px 10px 40px; 
 
}

<ul type="a"> 
 
    <li>preheat Oven: preheat oven to 350 degrees F(175 degrees C).</li> 
 
    <li>Make Lemon Filling: In a medium saucepan ...</li> 
 
    <ul class="first"> 
 
    <li>Whisk together 1 cup sugar, flour, cornstarch, and salt.</li> 
 
    <li>Stir in water, lemon juice and lemon zest.</li> 
 
    <li>Cook over medium-high heat, stirring frequently, until mixture comes to a boil.</li> 
 
    <li>Stir in butter.</li> 
 
    <li>Place egg yolks in a small bowl and gradually whisk in 1/2 cup of hot sugar mixture.</li> 
 
    <li>Whisk egg yolk mixture back into remaining sugar mixture.</li> 
 
    <li>Bring to a boil and continue to cook while stirring constantly until thick.</li> 
 
    <li>Remove from heat.</li> 
 
    <li>Pour filling into baked pastry shell.</li> 
 
    </ul> 
 
    <li>Make Meringue: In a large glass or metal bowl ...</li> 
 
    <ul class="second"> 
 
    <li>Whip egg whites until foamy.</li> 
 
    <li>Add sugar gradually, and continue to whip until stiff peaks form.</li> 
 
    <li>Spread meringue over pie, sealing the edges at the crust.</li> 
 
    </ul> 
 
    <li>Bake: Bake in preheated oven for 10 minutes, or until meringue is golden brown</li> 
 
</ul>

来源

2017-06-15 19:41:01

列表样式图像没有显示图标

回答

相关问题