.details { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; margin: 20px auto; padding: 20px; max-width: 1200px; border: 1px solid #ccc; border-radius: 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } .poster { flex: 1 1 30%; max-width: 30%; margin-bottom: 20px; } .poster img { width: 100%; height: auto; border-radius: 4px; } .tag-button { display: inline-block; text-align: center; text-decoration: none; background-color: #eee; margin: 2px; padding:5px 10px 5px 10px; color: #666; } .tag-button:hover { transform: scale(1.1); color: #ff4081; } .description { flex: 1 1 65%; max-width: 65%; } .play-button { display: inline-block; margin-top: 20px; padding: 10px 20px; background-color: #ff4081; color: white; text-align: center; text-decoration: none; border-radius: 4px; font-weight: bold; } /* 媒体查询:当屏幕宽度小于768px时(移动端) */ @media (max-width: 768px) { .poster, .description { flex: 1 1 100%; max-width: 100%; margin-bottom: 20px; } .description { margin-bottom: 0; } .play-button { width: 90%; text-align: center; } }