我正在制作登录屏幕,但很难找到一种解决方案来查看左侧的 image 1
和中心的 image 2
。它总是彼此相邻结束,或者图像位于我想要的位置但不在同一行。
img.logo2 {
display: inline-block;
}
img.roc1 {
display: inline-block;
width: 250px;
height: 125px;
}
header {
background-color: rgba(255, 0, 0, 0.7);
}
<header>
<img src="../styles/roc.png" class="roc1">
<img src="../fts.PNG" class="logo2">
</header>
最佳答案
你需要的是使用 absolute
定位和 text-align: center
是可行的,请看这个片段作为例子:
img.logo2 {
display: inline-block;
}
img.roc1 {
display: inline-block;
width: 250px;
height: 125px;
position: absolute;
top: 0;
left: 0;
}
header {
background-color: rgba(255, 0, 0, 0.7);
position: relative;
text-align: center;
height: 125px;
}
<header>
<img src="../styles/roc.png" class="roc1">
<img src="../fts.PNG" class="logo2">
</header>
关于html - 如何将一张图片放在左边,另一张图片放在一行的中央?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41652963/