TRA-APP/src/app/tab1/tab1.page.scss

.swiper-container {
    width: 100%;
    height: 300px; /* 设置轮播图高度 */

  }
  
  .ion-header {
    background-color: rgb(255, 255, 255); /* 设置ion-header的背景色为透明 */
    width: 410px;
    height: 50px;
    margin-left: 6px;
  }
  
  .ion-toolbar {
    //background-color: #2e91dc; /* 设置ion-toolbar的背景色为透明 */
    width: 410px;
    height: 50px;
    
  }

  .ion-header-title{
    background-color: #71509e; /* 设置ion-toolbar的背景色为透明 */
    width: 410px;
    height: 57px;
    
  }

  .swiper-wrapper {
    width: 100%;
    display: flex;
   
  }
  
  .swiper-slide {
    flex: 0 0 100%; /* 设置每个轮播项占据横向空间的比例 */
    padding: 10px; /* 设置内边距 */
    
  }
  .arrow-button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: rgba(225, 215, 215, 0.5);
    color: rgb(44, 40, 40);
    font-size: 20px;
    text-align: center;
    line-height: 40px;
    cursor: pointer;
  }
  
  .prev-button {
    left: 10px;
  }
  
  .next-button {
    right: 10px;
  }
  ion-card {
    margin: 20px;
  }
  
  .slide-img {
    width: 100%;
    height: auto;
    border: 2px solid #2e91dc; /* 设置边框样式 */
    border-radius: 10px; /* 设置边框圆角 */
  }
  
  ion-card-header {
    display: flex;
    //align-items:;
  }
  
  ion-card-title {
    font-weight:normal;
  }
  
  ion-card-subtitle {
    color: gray;
  }
  .custom-subtitle {
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 5px;
    color: white;
  }
  
  ion-card {
    position: relative;
  }
  
  .lvyou-img {
    width: 60px; /* 调整头像宽度 */
    height: 60px; /* 调整头像高度 */
    border-radius: 50%; /* 将头像设置为圆形 */
    margin-right: 10px; /* 调整头像与作者昵称的间距 */
  }
  
  ion-card-title {
    font-weight: bold;
  }
  
  ion-card-subtitle {
    color: gray;
  }

  .custom-button {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
  }
  
  .custom-button ion-icon {
    font-size: 24px; /* 调整图标大小 */
  }
  
  .custom-button ion-label {
    margin-top: 5px; /* 调整文字与图标之间的间距 */
  }