如截图所示，如何在文本中心和图像周围？ （附图）

Question

我正在使用Bootstrap框架将Illustrator设计转换为HTML和CSS。我被困在下面所示的设计部分：

我希望图像被图像包围如上所示。我可以单独存储这些图像，也可以单个图像，因为我可以根据需要从Illustrator中导出这些图像。如果需要，我也可以导出SVG图像。什么是实现此任务的最佳方法。

Answer 1

可能将文本放在相对位置并添加一个z-index使其位于图像上方。

Answer 2

使用CSS，您可以将图片显示为background-image 的<div>，可以在同一<div>内定制标题和标题的位置。

<强>标记：

<div>
<h2>We Only Work With the Best</h2>
<p>We screen our coders&#39; social profiles like LinkedIn, GitHub and StackOverflow. After that, we only expose them to smaller tasks until they build up their reputation.</p>
</div>

<强>样式：

div {
text-align: center;
background-image: url('/work-with-the-best.png') no-repeat;
}

div h2 {
margin-top: 200px;
}