body { font-family: Arial, sans-serif; background-color: #f4f4f4; margin: 0; padding: 0; } .container { width: 80%; margin: 50px auto; padding: 20px; background-color: white; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); border-radius: 8px; } h1, h2 { color: #333; text-align: center; } form { margin-bottom: 20px; } .form-group { margin-bottom: 15px; } label { display: block; margin-bottom: 5px; font-weight: bold; } input[type="text"], input[type="file"], input[type="date"] { width: 100%; padding: 8px; margin: 5px 0; border-radius: 4px; border: 1px solid #ddd; } button { padding: 10px 20px; color: white; border: none; border-radius: 4px; cursor: pointer; } button[type="submit"] { background-color: #4CAF50; } button[type="submit"]:hover { background-color: #45a049; } .btn-edit, .btn-delete { padding: 5px 10px; color: white; border: none; border-radius: 4px; cursor: pointer; } .btn-edit { background-color: #007BFF; } .btn-edit:hover { background-color: #0056b3; } .btn-delete { background-color: #DC3545; } .btn-delete:hover { background-color: #c82333; } /* 表格样式 */ table { width: 100%; border-collapse: collapse; margin-top: 20px; } table, th, td { border: 1px solid #ddd; } th, td { padding: 10px; text-align: center; } /* 照片展示样式 */ .photo-gallery { display: flex; flex-wrap: wrap; justify-content: center; gap: 15px; margin-top: 20px; } .photo-item { border: 1px solid #ddd; padding: 10px; border-radius: 5px; text-align: center; width: 200px; box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1); background-color: white; } .photo-item img { width: 100%; height: auto; border-radius: 5px; } /* 用户头像 */ .user-photo { max-width: 100px; max-height: 100px; width: auto; height: auto; }