Question

我有一个列表菜单（ul->li），我希望将图像放在左侧并将文本放在其前面。

问题是它使用float:left创建和楼梯。

我应该改变什么？

ul.list img{
   float:left;
   display:table;
   border-radius:10px;
   display: inline-block;
}

Answer 1

您应该将<img>更改为<li>

<强> CSS

ul.list li{
 text-align:left;
 display:block;
}

<强> pandas.DataFrame.to_sql

Answer 2

DEMO HERE

CSS

ul.list img{
 float:left;
 border-radius:10px;
}

ul li
{
    float:left;
}

HTML

<ul class="list">
    <li><a href="us"><img src="img/img.gif" width="30" class="" alt="img"></a>text</li>
    <li><a href="us"><img src="img/img.gif" width="30" class="" alt="img"></a>text</li>
    <li><a href="us"><img src="img/img.gif" width="30" class="" alt="img"></a>text</li>
    <li><a href="us"><img src="img/img.gif" width="30" class="" alt="img"></a>text</li>
    <li><a href="us"><img src="img/img.gif" width="30" class="" alt="img"></a>text</li>
    <li><a href="us"><img src="img/img.gif" width="30" class="" alt="img"></a>text</li>
</ul>

将图像留在文本左侧而没有此阶梯效果

2 个答案: