.container { width: 100%; height: 100vh; position: relative; background-color: #000; overflow: hidden; } /* 确保web-view在app基座中正确显示 */ .webview { width: 100% !important; height: 100% !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important; z-index: 1; } /* 针对app基座的特殊处理 */ /* #ifdef APP-PLUS */ .container { height: 100vh !important; overflow: hidden !important; } .webview { width: 100% !important; height: 100% !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important; z-index: 1 !important; } /* #endif */ .loading-container { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; display: flex; flex-direction: column; align-items: center; background-color: rgba(255, 255, 255, 0.95); padding: 30px; border-radius: 15px; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); } .loading-spinner { width: 50px; height: 50px; border: 4px solid #f3f3f3; border-top: 4px solid #3498db; border-radius: 50%; animation: spin 1s linear infinite; margin-bottom: 15px; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .loading-text { font-size: 16px; color: #333; font-weight: 500; } .error-container { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; display: flex; flex-direction: column; align-items: center; background-color: rgba(255, 255, 255, 0.95); padding: 30px; border-radius: 15px; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); min-width: 280px; } .error-text { font-size: 16px; color: #e74c3c; margin-bottom: 20px; text-align: center; line-height: 1.5; } .reload-btn, .fallback-btn, .clear-btn { background-color: #3498db; color: white; border: none; padding: 12px 24px; border-radius: 8px; font-size: 14px; margin: 5px; min-width: 120px; } .fallback-btn { background-color: #95a5a6; } .clear-btn { background-color: #e74c3c; } .debug-info { position: absolute; top: 300px; right: 10px; z-index: 3; background-color: rgba(0, 0, 0, 0.7); color: white; padding: 10px; border-radius: 5px; font-size: 12px; display: flex; flex-direction: column; } /* 自定义高度样式 */ .webview.custom-height { height: var(--custom-height, 100%) !important; } /* 针对不同高度的预设样式 */ .webview.height-50 { height: 50vh !important; } .webview.height-75 { height: 75vh !important; } .webview.height-90 { height: 90vh !important; } .webview.height-full { height: 100vh !important; }