html - 将图像放在 div 的右侧,而将其他图像放在中间

标签 html css

我有以下代码:

CSS

.producttype {

  height:16%;
  width:16%;
}

HTML

<div style="width:100%; box-shadow: 5px 5px 5px 5px #888888;padding:0.5%;">
<a href="../android">
<img src="http://empedure.com/products/media/images/icons/android_128.png" class="producttype" />
</a>
<a href="../iphone">
<img src="http://empedure.com/products/media/images/icons/iphone_128.png" class="producttype" />
</a> 
<a href="../windows">
<img src="http://empedure.com/products/media/images/icons/windows_128.png" class="producttype" />
</a>

下面是它的样子:

enter image description here

我希望它是这样的:

enter image description here

外层应该是DIV1,

I0 = 图像 1 左对齐

I1,I2,I3 = 应该在 DIV1 的中心组合的三个不同的图像

我尝试了 div 层,但是 I0 无法点击。

最佳答案

你在这里: http://jsfiddle.net/8u2Bp/1/

你必须设置一个父div

position:relative;
text-align:center;

然后在你想要的图片上留在左边

position:absolute;
left: 10px [distance you want it from the left border]

关于html - 将图像放在 div 的右侧,而将其他图像放在中间,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25428329/

相关文章:

html - div 中的 div 居中 CSS

javascript - 具有多个参数的 jQuery data()?

html - 悬停效果导致 float 导航项在填充百分比而不是像素后从其包含元素中消失?

html - 不同分辨率下的不同 Div 对齐

javascript - 是否可以使用 JS 或 CSS 从谷歌地图中删除地标?

jquery - 卡住第一列和细节

javascript - 如何用Jquery获取上层HTML标签

css - css多背景,只重复一个背景

jquery - Safari 在页面转到 url 后添加类,而不是 'on click'

javascript - 将 HTML/CSS 元素转换为可重用的 AngularJS 指令?