首页 > 解决方案 > 如何将文本或图像与 HTML 或 CSS 中的数值对齐?

问题描述

我是CSS新手,但我知道HTML,我正在创建一个网站作为我学习过程的一部分。我的问题是我无法将文本或图像与-10px 或 -5% 等数值对齐。我所能做的就是将它与 text-align: left 或 float: left 对齐。这是我面临问题的部分,我需要在我的徽标名称旁边对齐徽标。就像文本旁边的 StackOverflow 徽标(是的,我注意到它是一个图像,没有文本)这是我的标题:

<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>

但这看起来很奇怪,因为徽标和文本之间没有空格。有什么办法可以克服这个吗?

标签: htmlcsstextalignment

解决方案


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

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


推荐阅读