img https://img-mid.csdnimg.cn/release/static/image/mid/ask/176764191926160.png
大概是这么个意思
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<div style="display: inline-flex;flex-direction: row;align-items: center;justify-content: center;">
<div style="width: 40px;height: 2px;background-color: #ff0000;z-index: 1"></div>
<div style="width: 10px;height: 10px;border-radius: 50%;background-color: blue;z-index: 99;position: relative;left: -49%"></div>
</div>
</body>
</html>
定位position: absolute；层级 z-index:100
<div>
<div class="line"></div>
<img src="" class="img" />
</div>
<style>
.img {
position: relative;
top: -20px;
left: 20px;
width: 40px;
height: 40px;
}
.line {
height: 1px;
width: 100px;
background: #000;
}
</style>
解决了望采纳 谢谢