图像位于2个div的中间

Question

我有2个div，div 1＆amp; 2.我希望在2个div的中间有一个图像（如图所示）。我该怎么做？

Answer 1

您可能希望利用两个div周围的环绕，然后将图像绝对定位在包裹内，如下所示。

html,
body {
	height: 100%;
	margin: 0;
}
.wrap {
	height: 100%;
}
.image {
	display: block;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	position: absolute;
}
.div1, .div2 {
	width: 100%;
	height: 50%;
	float: left;
}
.div1 {
	background: red;
}
.div2 {
	background: blue;
}

<div class="wrap">
	<img src="https://i.imgur.com/NS73UoB.png" alt="Asshat" height="200" class="image">
	<div class="div1"></div>
	<div class="div2"></div>
</div>