Html 如何保持图像和文本并排并非常接近改变图像大小？

我有图像和文本与引导行和列并排，如下所示

你好
我是哈里

当我将宽度设置为100%时，图像看起来非常大。我希望它远小于50%

当我将其设置为

50%

时，文本和图像之间的间距会变大。我可以将图像设置为

向右浮动

，但它不会使图像和文本居中。如何使这个较小的图像保持分辨率并像第一个图像一样居中？

现在检查

<div class="container-fluid"> 
  <div class="row">
      <div class="col-md-6 text-center text-md-right">
        <img src="https://www.irishtimes.com/polopoly_fs/1.3170107.1501253408!/image/image.jpg_gen/derivatives/ratio_1x1_w1200/image.jpg" width="50%" alt="">
      </div>
      <div class="col-md-6">
        <h1 style="font-size: 96px;" class="mr-4">Hello<br>I'm Harry</h1>
      </div>
  </div>

</div>

你好
我是哈里

---

您可以简单地执行以下操作。调整

列-*

大小

你好
我是哈里

图像应位于左侧。当我替换列时，文本右侧将第一个单词置于右侧，这是一个很好的解决方案，但也需要centered@Timuçinçek需要以什么为中心？全文+图片？@Timuçinçiçek检查更新

<div class="container-fluid"> 
  <div class="row">
      <div class="col-md-6 text-center text-md-right">
        <img src="https://www.irishtimes.com/polopoly_fs/1.3170107.1501253408!/image/image.jpg_gen/derivatives/ratio_1x1_w1200/image.jpg" width="50%" alt="">
      </div>
      <div class="col-md-6">
        <h1 style="font-size: 96px;" class="mr-4">Hello<br>I'm Harry</h1>
      </div>
  </div>

</div>