<分区>
html - 如何将图像放在文本的右侧？
我在尝试将图像放在右侧并将文本保持在左侧时遇到了一些麻烦，同时它始终居中。
我正在使用内联 block ，但它似乎没有帮助。
这就是我想要的样子。
这就是我得到的
这是 HTML:
<div class="hosting">
<h1 >Lorem, ipsum.</h1>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Animi, soluta.</br>
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Dignissimos, facere!<br>
Lorem ipsum dolor sit amet consectetur adipisicing.<br>
Lorem ipsum dolor sit amet consectetur adipisicing elit.</br>
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Debitis, blanditiis.
</p>
<img src="images/illustration.png" alt="hosting" class="hosting-img">
</div>
这是CSS:
.hosting-img {
height: 300px;
}
.hosting {
width: 100%;
height: 100%;
margin-top: 150px;
align-items: center;
justify-content: center;
position: relative;
display: inline-block;
text-align: center;
}
最佳答案
一个选项是在 .hosting div 中设置每个元素的宽度。
.hosting-img {
height: 300px;
width: 50%;
}
.hosting p {
width: 50%;
}
.hosting {
width: 100%;
height: 100%;
margin-top: 150px;
align-items: center;
justify-content: center;
position: relative;
display: inline-block;
text-align: center;
}
关于html - 如何将图像放在文本的右侧？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/59605728/