HTML - CSS |我想在我的英雄图像中实现2个自定义div形状，但进展不顺利

HTML和CSS是前端开发中常用的两种技术，用于构建网页和实现页面样式。在你想在英雄图像中实现两个自定义div形状的情况下，可以使用HTML和CSS来实现。

首先，你可以在HTML中创建一个包含英雄图像的div容器，并为其设置一个唯一的id，以便通过CSS进行样式设置和操作。例如：

<div id="hero-image">
  <!-- 在这里插入你的英雄图像 -->
</div>

接下来，你可以使用CSS来为这个div容器设置样式，并实现两个自定义div形状。可以使用CSS的伪元素选择器和形状属性来实现。

#hero-image {
  position: relative;
  width: 400px; /* 设置英雄图像容器的宽度 */
  height: 300px; /* 设置英雄图像容器的高度 */
}

#hero-image::before {
  content: "";
  position: absolute;
  top: 50px; /* 设置自定义div1的位置 */
  left: 50px; /* 设置自定义div1的位置 */
  width: 100px; /* 设置自定义div1的宽度 */
  height: 100px; /* 设置自定义div1的高度 */
  background-color: red; /* 设置自定义div1的背景颜色 */
}

#hero-image::after {
  content: "";
  position: absolute;
  top: 150px; /* 设置自定义div2的位置 */
  left: 250px; /* 设置自定义div2的位置 */
  width: 150px; /* 设置自定义div2的宽度 */
  height: 50px; /* 设置自定义div2的高度 */
  background-color: blue; /* 设置自定义div2的背景颜色 */
}

通过以上代码，你可以实现在英雄图像中添加两个自定义div形状。可以根据实际需求调整位置、大小和颜色等样式属性。

关于HTML和CSS的更多学习资源，你可以参考以下链接：

请注意，以上回答仅供参考，具体实现方式可能根据实际需求和情况有所调整。