CSS显式锚点相对两个元素定位效果实例页面

CSS代码：

.trigger1 {
   anchor-name: --anchor-a;  
}
.trigger2 {
   anchor-name: --anchor-b;  
}
.target {
  position: absolute;
  left: anchor(--anchor-a right);
  right: anchor(--anchor-b left);
}

HTML代码：

<p class="flex-space-between">
  <button class="trigger1">按钮1</button>
  <button class="trigger2">按钮2</button>
</p>

<div class="target">
  <img src="1.jpg" width="100%" />
</div>