workspace/.history/soul-app/src/app/drift-bottle/drift-bottle.component_20241224211547.html

<ion-content [fullscreen]="true">
  <div class="top-image" >
    <img src="assets/img/漂流瓶.jpg" alt="漂流瓶">
    
  </div>
  <!-- 其他内容可以放在这里 -->
  <!-- 左边的按钮 -->
  <div class="button-container left-button" (click)="throwDriftBottleModal()">
    <img src="assets/img/扔一个.png" alt="扔漂流瓶" class="circular-button">
  </div>

  <div class="button-container middle-button" >
    <ion-button  fill="clear" color="rgba(255, 255, 255, 0.6)"  >
        我的漂流瓶
      </ion-button>
  </div>

  <!-- 右边的按钮 -->
  <div class="button-container right-button">
    <img src="assets/img/捞一个.png" alt="捞漂流瓶" class="circular-button">
  </div>

   <!-- 背景音乐 -->
   <audio id="backgroundAudio" autoplay loop>
    <source src="assets/audio/海浪.mp3" type="audio/mpeg">
    Your browser does not support the audio element.
  </audio>
</ion-content>