CSS照片在右上角和内部照片中的位置

Question

你好，我想创建像这样的照片 我希望此徽标位于右上角和该人的照片中

这是我的代码

<div style='position:relative'>
  <img src='https://i.ibb.co/gFsCTmf/orang.jpg'>
  <img src='https://i.ibb.co/hLB6zMr/logo.png' style='position:absoulute;top:-10px;right:0px'>
</div> 

这是我的jsfiddle我试图在徽标图片中添加绝对位置，并且div相对位置相对不起作用。帮帮我谢谢的

Answer 1

您的绝对拼写错误，并且需要特定的图像div宽度。

<div style='position:relative;width: 252px;'>
  <img src='https://i.ibb.co/gFsCTmf/orang.jpg'>
  <img src='https://i.ibb.co/hLB6zMr/logo.png' style='display:block;position:absolute;top:0;right:0;'>
</div>

Answer 2

它可以在JSFiddle上运行，如果位置不正确，请更改顶部和左侧代码。

.logo {
  width: 19%;
  position: absolute;
  top: 11%;
  left: 57.5%;
  transform: translate(-50%, -50%);
}

<img src='https://i.ibb.co/gFsCTmf/orang.jpg'>
<img src='https://i.ibb.co/hLB6zMr/logo.png' class="logo">

Answer 3

<div style="position:relative;width: 247px;">
<img src="https://i.ibb.co/gFsCTmf/orang.jpg">
<img src="https://i.ibb.co/hLB6zMr/logo.png" style="position:absolute;top: 
-5px;right: -5px;">
</div>