需要在Hugo页面中插入图片的帮助吗？

问题描述

所以我正在使用hugo创建一个网站，并且我想在某个部分放置图片。 enter image description here

所以我想在博客标题后面插入图片代替粉红色bg 我认为该特定部分的代码是

<!-- page-title -->
<section class="section bg-secondary">
   <div class="container">
     <div class="row">
       <div class="col-lg-12">
         <h4>{{ .Title }}</h4>
       </div>
     </div>
   </div>
</section>
<!-- /page-title -->

在这段代码中我要怎么做才能在标题后面的那部分插入图片？

解决方法

这里。 HTML

<!DOCTYPE html>
<html lang="en">
  <head>
    <link rel="stylesheet" href="style.css" />
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <div class="parent">
        <img src="https://images.unsplash.com/photo-1573470271783-0054dcd317fd?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1791&q=80" alt="">
      <div class="text">
        Charming evening Field
      </div>
    </div>
  </body>
</html>

CSS

* {
  margin: 0;
  padding: 0;
}

.parent {
  position: relative;
  background-color: pink;
  height: 40vh;
  font-size: 3vw;
}
.parent img{
  padding-top: 2%;
  padding-left: 2%;
  width:30vw;
  height: 30vh;
}
.text {
  color: white;
  position: absolute;
  top: 48px;
  left: 26px;
}

html hugo web