.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; /* 调整文字与图标之间的间距 */ }