body, html { height: 100%; margin: 0; } body { visibility: hidden; opacity: 0; transition: opacity 0.3s ease, visibility 0.3s ease; } .gjs-mdl-dialog { background-color: white; color: #333; } .gjs-cv-canvas-bg { width: 100%; } .gjs-pn-options { right: unset; left: 33%; } .gjs-pn-buttons { text-align: right; display:block; } /* 美化下拉选择框 */ .custom-select { margin-left: 10px; padding: 3px 16px; /* 增加内边距,为下拉内容留出空位 */ font-size: 14px; /* 字体大小 */ color: #444; /* 字体颜色 */ background-color: #fff; /* 背景颜色 */ border: 1px solid #ddd; /* 边框 */ border-radius: 4px; /* 圆角 */ outline: none; /* 去掉聚焦时的默认边框 */ cursor: pointer; /* 鼠标指针样式 */ transition: all 0.3s ease; /* 过渡效果 */ appearance: none; /* 移除默认的下拉箭头 */ position: relative; /* 为下拉箭头定位 */ width:200px; } /* 悬停效果 */ .custom-select:hover { background-color: #f8f8f8; /* 悬停时的背景颜色 */ border-color: #ccc; /* 悬停时的边框颜色 */ } /* 聚焦效果 */ .custom-select:focus { border-color: #ccc; /* 聚焦时的边框颜色 */ box-shadow: 0 0 5px rgba(0, 123, 255, 0.2); /* 聚焦时的阴影 */ } /* 下拉箭头样式 */ .custom-select::after { content: '\f0d7'; /* FontAwesome 下拉箭头图标 */ font-family: 'FontAwesome'; position: absolute; right: 8px; /* 调整箭头位置,使其与右边距对齐 */ top: 50%; transform: translateY(-50%); pointer-events: none; /* 防止点击事件 */ color: #444; /* 下拉箭头颜色 */ }