202226701051/fashion-app/src/app/post/post.component.html

<ion-content >
  <div class="post">
    <div class="post-header">
      <div class="avatar">
        <img src="../../assets/images/cxtouxiang.jpg" alt="User Avatar" class="avatar-image">
      </div>
      <div class="user-info">
        <span class="username">用户名</span>
        <ion-icon name="ellipsis-horizontal" class="more-icon"></ion-icon>
      </div>
    </div>
    <h2 class="post-title">帖子标题</h2>
<!--标签-->
<div class="tag-container">
  <div class="tag"><ion-icon name="bookmark-outline" class="tagpicture"></ion-icon>标签1</div>
  <div class="tag"><ion-icon name="bookmark-outline" class="tagpicture"></ion-icon>标签2</div>
  <div class="tag"><ion-icon name="bookmark-outline" class="tagpicture"></ion-icon>标签3</div>
  <div class="tag"><ion-icon name="bookmark-outline" class="tagpicture"></ion-icon>标签4</div>
</div>

    <p class="post-content-text">这里是帖子内容，描述了帖子的详细信息和背景。</p>
    <div class="image-gallery">
      <img src="../../assets/images/touxiang.jpg" alt="Post Image" class="post-image">
      <img src="../../assets/images/2.jpg" alt="Post Image" class="post-image">
      <img src="../../assets/images/cxtouxiang.jpg" alt="Post Image" class="post-image">
      <img src="../../assets/images/cxtouxiang.jpg" alt="Post Image" class="post-image">
    </div>

     <!-- 按钮区域 -->
     <div class="button-container">
      <ion-button fill="clear" class="action-button">
        <ion-icon name="share-social-outline" class=""></ion-icon>
        <span>分享</span>
      </ion-button>
      <ion-button fill="clear" class="action-button">
        <ion-icon name="chatbubble-outline"></ion-icon>
        <span>评论</span>
      </ion-button>
      <ion-button fill="clear" class="action-button">
        <ion-icon name="heart-outline"></ion-icon>
        <span>点赞</span>
      </ion-button>
    </div>

  </div>
</ion-content>