UIwebview中的css图像覆盖和内联块答案

【问题标题】：css image overlays and inline block in UIwebviewUIwebview中的css图像覆盖和内联块
【发布时间】：2013-05-23 00:14:52
【问题描述】：

在 iOS 应用程序上，我试图列出用户图库中的所有图像，在每个图像的左上角（或右上角）浮动一个可点击的红色 x，并以网格模式显示，我在这里的工作在我的浏览器中，但是当我在 phonegap 中运行它时，它在 iOS 或 android 中无法正确显示。我不确定从这里去哪里，或者是否有可能，如果这很重要，我正在使用 jQuery mobile。我尝试在没有 jQuery 的情况下运行代码并收到相同的结果..

<span id="client_logos">
    <div class="imgspan">
        <img src="img1.jpg" width="118" height="118" alt="" border="0" class="timg">
        <a href=""><img src="icon-folder.gif" width="28" height="28" alt="" border="0" class="fimg"></a>
    </div>

    <div class="imgspan">
        <img src="img2.jpg" width="118" height="118" alt="" border="0" class="timg">
        <a href=""><img src="icon-folder.gif" width="28" height="28" alt="" border="0" class="fimg"></a>
    </div>

    <div class="imgspan">
        <img src="img3.jpg" width="118" height="118" alt="" border="0" class="timg">
        <a href=""><img src="icon-folder.gif" width="28" height="28" alt="" border="0" class="fimg"></a>
    </div>
</span>

我的 CSS 是：

.client_logos {
    display: inline-block;
    width:100%;
}
.timg {
    position:absolute;
}
.fimg {
    float:left;
    position:absolute;
}
.imgspan {
    display: inline-block;
    margin: 0 5px;
    width:120px;
    height:120px;
}

【问题讨论】：

标签： iphone css uiwebview

【解决方案1】：

我看到你的代码有很多错误，这可能是问题所在：

Span #client_logos 应该是一个 div，因为它不能正确地将 html 元素包装在一个 span 内。
CSS 声明为 .clients_logos，但您的 span 使用的是 ID，根本没有类。
fimg 和timg 使用的是position: absolute，但他的父级.imgspan 没有职位，你应该添加一个职位：
.imgspan { 显示：内联块；边距：0 5px；宽度：120px；高度：120px； }

【讨论】：