html - <li> 标签内的图片

标签 html css css-float

我对 <li> 中的 float 元素有疑问标签。

我有以下标记

<li>
<img src="concept-truck.jpg" alt="2013 Toyota Tacoma" id="itemImg" style="float:left">
<p>2013 Toyota Tacoma</p>
<p>Price : 450000$</p>
<p>Year : 2013</p>
<p><a href="/item/index/63">more</a></p>            
</li>

在 FF 中,IE 工作正常,但在 Chrome 列表中,计数也会 float 图像。 如何解决?谢谢

最佳答案

我会这样重写你的例子:

<li>
    <div style="float: left;">
        <img src="concept-truck.jpg" alt="2013 Toyota Tacoma" id="itemImg">
    </div>
    <div style="float: left;">
        <p>2013 Toyota Tacoma</p>
        <p>Price : 450000$</p>
        <p>Year : 2013</p>
        <p><a href="/item/index/63">more</a></p>
    </div>
    <div style="float: none; clear: both;"></div>
</li>

这是用内联样式的 CSS 属性编写的,我通常会避免使用这种属性,但在您的示例中,我按照您的方式编写 - 内联。

关于html - <li> 标签内的图片,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17921949/

相关文章:

c# - Windows文件夹路径困惑

html - 是否存在 "multilayer"子选择器?

css - 如何过渡高度 : 0; to height: auto; using CSS?

javascript - Jquery 1.9.1、CSS 和谷歌地图 : "Display: none" issue

css - 如何将 float 的 child 扩展到 parent 的高度?

html - 当向右浮动两个元素时,它们会切换位置

html - 如何将此 css 隔离到适当且唯一的类中,以便它们不会干扰其他页面布局

html - 2 div 在另一个 "container"div - 适应宽度

html - 垂直对齐两个不同高度的右拉元素(Bootstrap)

javascript - AngularJS 中的动态表单字段