如何用html在图片右面加一个剪头？_随笔

其实很简单，使用绝对定位就可以了，先设置一个盒子作为图片和箭头的父级盒子，然后设置一个盒子，width为100%；图片自适应盒子。然后设置一个放箭头的盒子，大小根据你的实际情况设置。

然后给父级盒子设置position: relative给子级的箭头盒子设置position: absolute

例如：

</div>

</div>

.box{

width:80%

margin:0 auto

position: relative

}

.box-img{

width:100%

}

.auto-img{

width:100%

display: block

}

.box-jt{

width:80px

position: absolute

top:50%

left:50%

transform: translate(-50%, -50%)

}

<!DOCTYPE html>

<head>

<title>Document</title>

</head>

<body>

const canvas=document.getElementById('canvas')

const ctx=canvas.getContext('2d')

</body>

</html>

欢迎分享，转载请注明来源：内存溢出

如何用html在图片右面加一个剪头？