/* 移除或注释掉这个部分,因为它可能会影响原有的布局 */ /* body { font-family: Arial, sans-serif; display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0; background-color: #f0f0f0; } */ /* 调整聊天框的样式 */ .chat-container { position: fixed; bottom: 220px; right: 20px; width: 300px; height: 400px; border: 1px solid #ccc; border-radius: 5px; overflow: hidden; background-color: white; z-index: 1000; box-shadow: 0 0 10px rgba(0,0,0,0.1); } /* 其他样式保持不变 */ .chat-container #chat-history { height: 340px; overflow-y: auto; padding: 10px; } .chat-container .input-area { display: flex; padding: 10px; border-top: 1px solid #ccc; } .chat-container #user-input { flex-grow: 1; margin-right: 10px; padding: 5px; } .chat-container #send-btn { padding: 5px 10px; background-color: #414582; color: white; border: none; cursor: pointer; } .message { margin-bottom: 10px; padding: 10px; border-radius: 4px; } .user-message { background-color: #e6f2ff; align-self: flex-end; } .ai-message { background-color: #f0f0f0; align-self: flex-start; }