如何在<li>

Question

我想在<li>内添加图片而不会干扰<li>的尺寸。我希望图像位于左上角，从顶部，底部和左侧开始有0个边距，如下所示：

我使用了这个HTML代码：

          <li><img src="image.jpg">text</li>

和这个CSS：

ul li
{
    max-height:52px;
}

ul li img
{
    max-width:52px;
    max-height:52px; 
    margin-top:-15px;
    margin-left:-15px;
    float:left;
}

让它看起来像那样：

对于所有屏幕尺寸看起来都很好。但这样做的方式并不专业。

1. 添加图片的最佳做法是什么？<li>内的左上角和左上角有0个边距？

2. 在这种情况下，我为<li>添加了最大高度，以使其正常工作。有没有办法与父子关系一起做，并根据<li>身高使图像互动？

Answer 1

试试这个

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

在你的css课程中

Answer 2

我会将图像放在自己的标签中（让它成为img，div）并设置其CSS样式。

尝试使用

"float: left;"
"position: relative;" 

使用定位。