.full-screen { height: 100vh; display: flex; justify-content: center; align-items: center; } .about-container { background: linear-gradient(to top left, #5c907e, #2e4638); } .app-container { background: linear-gradient(to bottom right, pink, #ff4081); padding: 10px; display: flex; } .contact-container { background: linear-gradient(to top left, #054879, #14161a); padding-left: 60px; display: flex; justify-content: start; align-items: center; } .section-title { padding: 20px; font-size: 56px; font-weight: 900; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif } .company-info { padding-bottom: 10px; width: 80%; } .about-content { display: flex; flex-direction: column; justify-content: center; align-items: center; max-width: 90%; } .contact-content { display: flex; color: white; flex-direction: column; justify-content: start; align-items: start; max-width: 90%; } .contact-content a { text-decoration: none; font-size: 20px; color: #e864ff; padding: 20px; } .contact-content a:hover { color: white; } .left { padding: 40px; max-width: 800px; } .right { padding: 10px; display: flex; justify-content: center; } .app-name { font-size: 56px; font-weight: 900; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; margin-top: 20px; margin-bottom: 20px; } .app-description { font-size: 18px; margin-bottom: 40px; } .app-icon { width: 150px; border: 3px solid #eeeeee; border-radius: 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } .app-download-btn { background-color: black; display: inline-block; border-radius: 8px; margin-right: 20px; margin-bottom: 10px; } .app-download-btn img { width: 150px; height: 40px; cursor: pointer; } .app-download-btn:hover { border: 1px solid #ff4081; } /* 媒体查询:当屏幕宽度小于768px时,改为上下排布 */ @media (max-width: 768px) { .left { padding: 10px; } .contact-container { padding-left: 20px; } .right { display: none; } .company-info { width: 100%; } .app-name { font-size: 48px; } .section-title { font-size: 48px; } } .slideshow-container { position: relative; max-width: 1000px; margin: auto; } .mySlides { display: none; } .fade { animation-name: fade; animation-duration: 2.5s; } @keyframes fade { from {opacity: .1} to {opacity: 1} }