1

我有一个现有的 div。我想在这个 div 上添加一些小图像图标（如问号 png 图标），但我会将它直接浮动在以下任一位置的 div 角落上方（但仍在 div 区域内）：

右上 左上 左下 右下

一个条件是它永远不会改变现有的 div（布局、边距、样式等没有变化）。图标只会浮在上面。我正在尝试对图像使用 padding-left 属性，但它破坏了现有 div 的布局。即使图标漂浮在它们上方，我也希望它们保持不变。有没有使用 jQuery 或 CSS 的简单方法？

感谢您分享提示。

4

2 回答 2

1

你可以试试：

HTML

<div class="target" style="position:relative;height:200px;width:200px;background: #ccc;margin: 25px">
    Target div
</div>

jQuery

$('.target').append('<img src="http://www3.emersonprocess.com/rosemount/wirelessestimator/App_Themes/Basic/images/questionmark_icon.gif" style="position:absolute; top: -20px; right: -12px">');​

演示

​</p>

于 2012-12-14T03:44:42.933 回答
0

要制作您想要的东西，您可以使用 CSS。假设您的 4 s 在 div 中，您可以通过两种方式进行操作：

  • 将 CSS 样式 position: relative 放在 DIV 上，并将 position: absolute 放在每个 . 然后，对于 each ，您可以使用 CSS 位置规则，例如top、bottom、left、right来放置您的元素

例子：

<div style="position: relative; width: 100px; height: 100px">
    <img src="your_file" style="position: absolute; left: 0; top: 0; width: 10px; height: 10px;">
    ....other <img> with different position...
</div>
  • 使用 s 上的浮动 CSS 属性（左、右）将它们放在 .
于 2012-12-14T03:48:53.827 回答