如何将文本或图像与 HTML 或 CSS 中的数值对齐？

Question

我是 CSS 的新手，但知道 HTML，我正在创建一个网站作为一部分我的学习过程。我的问题是我无法将文本或图像与数值对齐，例如-10px或-5%。我所能做的就是将它与 text-align: left 或 float: left 对齐。这是我遇到问题的部分，我需要在我的徽标名称旁边对齐 a 徽标。 就像文本旁边的 Whosebug 徽标一样（ya，我注意到这是一张图片，没有文字) 这是我的 header:

<body style="background-color: #111827;">
    <header>
        <img style="border: 3px solid #ddd;height: 65px;width: 65px; border-radius: 15%; float: left;" src="https://dummyimage.com/50x50" alt="some-pic">
    <h1 style=" color: white; font-family:Agency FB; text-align: left; font-size: 50px;">Some Title</h1>
    </header>
    <hr>
</body>
</html>

但这看起来很奇怪，因为徽标和文本之间没有 space。有什么办法可以克服这个问题吗？

Answer 1

<h1 style=" color: white; font-family:Agency FB; text-align: left; font-size: 50px; margin-left:100px">Some Title</h1>

只需将 margin-left 属性添加到 H1 标签即可满足您的要求

Answer 2

将整个img标签移动到h1标签（在其开头）

如何将文本或图像与 HTML 或 CSS 中的数值对齐？

How to align text or Image with numerical values in HTML or CSS?

html

css

text

alignment