HTML 在源中插入 iFrame=

Question

晚上好，我想在图像上插入谷歌地图 iframe。 我取得了一些成功，但仍然很糟糕，这是引用图像的代码

 <div class="col-lg-3 col-md-6 mb-4">
    <div class="card h-100">
      <img class="card-img-top" src="http://placehold.it/500x325" alt="">
      <div class="card-body">
        <h4 class="card-title">Card title</h4>
        <p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Explicabo magni sapiente, tempore debitis beatae culpa natus architecto.</p>
      </div>
      <div class="card-footer">
        <a href="#" class="btn btn-primary">Find Out More!</a>
      </div>

到目前为止，这是我想出的。

 <div class="col-lg-3 col-md-6 mb-4">
    <div class="card h-100">
      <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d220.08139891259287!2d-16.537684585177796!3d28.045790417358596!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0xc6a9fe24a762f01%3A0xf5eead7f2fbfb600!2sFarmacia%20M%C3%A9dano!5e0!3m2!1sen!2sde!4v1571248138202!5m2!1sen!2sde" width="500" height="325" frameborder="0" style="border:0;" allowfullscreen="" name="farmaciamedano"></iframe>
      <img class="card-img-top" src="https://www.w3schools.com" target="farmaciamedano" W3Schools.com alt=""
      <div class="card-body">
        <h4 class="card-title">Farmacia Medano</h4>
        <p class="card-text">Some relevant text Some relevant textSome relevant textSome relevant textSome relevant text</p>
      </div>

它几乎在那里，但是当我在电脑上查看它时，文本框大小是错误的。 还有这条线

 <div class="card-body">

使用括号时显示为红色。

任何帮助，将不胜感激