.container { min-height: 100vh; background: #fff; padding: 20px; } // 操作按钮区(打印时隐藏) .actionBar { position: sticky; top: 0; z-index: 1000; background: #fff; padding: 16px 0; margin-bottom: 24px; border-bottom: 1px solid #e5e5ea; display: flex; justify-content: space-between; align-items: center; .backButton { color: #007aff; border-color: #007aff; &:hover { color: #0051d5; border-color: #0051d5; } } } // 加载状态 .loadingContainer { display: flex; flex-direction: column; justify-content: center; align-items: center; min-height: 100vh; background: #fafafa; } // 打印内容区 .printContent { max-width: 210mm; // A4纸宽度 margin: 0 auto; background: #fff; padding: 0; } // 试卷头部 .paperHeader { text-align: center; margin-bottom: 24px; padding-bottom: 16px; border-bottom: 2px solid #1d1d1f; .paperTitle { margin: 0 0 16px 0 !important; color: #1d1d1f !important; font-weight: 700 !important; font-size: 28px !important; } .examInfo { display: flex; justify-content: space-around; margin-top: 16px; .infoItem { font-size: 16px; color: #1d1d1f; font-weight: 500; } } } // 考试说明卡片 .instructionCard { margin-bottom: 24px; border-radius: 8px; border: 1px solid #d1d1d6; :global(.ant-card-body) { padding: 20px; } h4 { margin-bottom: 12px; color: #1d1d1f; font-weight: 600; font-size: 16px; } ul { margin: 0; padding-left: 20px; color: #1d1d1f; line-height: 1.8; li { margin-bottom: 6px; font-size: 14px; } } } // 题目组 .questionGroup { margin-bottom: 32px; page-break-inside: avoid; .groupHeader { display: flex; align-items: baseline; margin-bottom: 16px; padding-bottom: 8px; border-bottom: 1px solid #d1d1d6; .groupTitle { font-size: 18px; color: #1d1d1f; font-weight: 700; } .groupScore { font-size: 14px; margin-left: 8px; color: #6e6e73; } } .questionsList { padding-left: 0; } } // 题目项 .questionItem { margin-bottom: 24px; page-break-inside: avoid; .questionContent { margin-bottom: 12px; line-height: 1.8; span { font-size: 15px; color: #1d1d1f; } } .optionsList { margin: 12px 0; padding-left: 20px; .optionItem { margin-bottom: 8px; line-height: 1.6; font-size: 14px; color: #1d1d1f; } } .answerArea { margin-top: 12px; padding: 8px 0; span { font-size: 14px; color: #1d1d1f; } .blankLine { margin-bottom: 8px; line-height: 2; font-size: 14px; } .answerLines { margin-top: 8px; .answerLine { line-height: 2; margin-bottom: 4px; font-size: 14px; color: #1d1d1f; } } .essayAnswer { :global(.ant-typography) { margin-bottom: 8px; line-height: 1.8; font-size: 14px; color: #1d1d1f; } } } } // 打印样式 @media print { // 隐藏不需要打印的元素 .noPrint, :global(.noPrint) { display: none !important; } // A4纸张设置 - 增加边距以确保圆角不被遮挡 @page { size: A4; margin: 1cm; } .container { background: #fff; padding: 0; } .printContent { max-width: 100%; margin: 0; padding: 0; } .paperHeader { margin-bottom: 6px; padding-bottom: 4px; .paperTitle { font-size: 16pt !important; margin-bottom: 4px !important; } .examInfo { display: flex; justify-content: space-between; align-items: center; margin-top: 4px; width: 100%; font-family: 'SimSun', '宋体', serif; .infoItem { font-size: 9pt; white-space: nowrap; flex: 1; text-align: center; } } } .instructionCard { margin-bottom: 6px; border: 1px solid #000; // 确保圆角不被裁剪 border-radius: 8px; overflow: visible; // 添加一些内边距确保圆角有空间显示 padding: 2px; :global(.ant-card-body) { padding: 6px; } h4 { font-size: 10pt; margin-bottom: 2px; } ul { margin: 0; padding-left: 12px; li { font-size: 8pt; margin-bottom: 1px; line-height: 1.2; } } } .questionGroup { margin-bottom: 8px; .groupHeader { margin-bottom: 4px; padding-bottom: 2px; .groupTitle { font-size: 12pt; } .groupScore { font-size: 10pt; } } } .questionItem { margin-bottom: 6px; .questionContent { margin-bottom: 3px; line-height: 1.3; span { font-size: 10pt; font-family: 'SimSun', '宋体', serif !important; font-weight: normal !important; } } .optionsList { margin: 4px 0; padding-left: 14px; .optionItem { margin-bottom: 1px; font-size: 9pt; font-family: 'SimSun', '宋体', serif !important; font-weight: normal !important; line-height: 1.2; } } .answerArea { margin-top: 4px; span { font-size: 9pt; font-family: 'SimSun', '宋体', serif !important; font-weight: normal !important; } .blankLine { font-size: 11pt; font-family: 'SimSun', '宋体', serif !important; font-weight: normal !important; } .answerLines { .answerLine { font-size: 11pt; font-family: 'SimSun', '宋体', serif !important; font-weight: normal !important; } } .essayAnswer { :global(.ant-typography) { font-size: 11pt; font-family: 'SimSun', '宋体', serif !important; font-weight: normal !important; } } } } // 强制分页 .pageBreak { page-break-after: always; } // 移除分页限制,允许更紧密的排版 // 黑白打印优化和字体设置 * { color: #000 !important; background: #fff !important; box-shadow: none !important; text-shadow: none !important; font-family: 'SimSun', '宋体', serif !important; font-weight: normal !important; } // 保留边框 .paperHeader, .instructionCard, .groupHeader { border-color: #000 !important; } } // 响应式设计 - 移动端 @media (max-width: 768px) { .container { padding: 12px; } .actionBar { padding: 12px 0; flex-direction: row; justify-content: space-between; align-items: center; :global(.ant-space) { width: auto; button { flex: none; width: auto; height: 32px; padding: 0 12px; font-size: 12px; } } } .printContent { max-width: 100%; } .paperHeader { .paperTitle { font-size: 22px !important; } .examInfo { flex-direction: column; gap: 8px; .infoItem { font-size: 14px; } } } .instructionCard { :global(.ant-card-body) { padding: 16px; } h4 { font-size: 14px; } ul { li { font-size: 13px; } } } .questionGroup { .groupHeader { flex-direction: column; align-items: flex-start; gap: 4px; .groupTitle { font-size: 16px; } .groupScore { font-size: 13px; } } } .questionItem { .questionContent { span { font-size: 14px; } } .optionsList { padding-left: 16px; .optionItem { font-size: 13px; } } .answerArea { span { font-size: 13px; } .blankLine { font-size: 13px; } .answerLines { .answerLine { font-size: 13px; } } .essayAnswer { :global(.ant-typography) { font-size: 13px; } } } } } // 响应式设计 - 平板 @media (min-width: 769px) and (max-width: 1024px) { .container { padding: 16px; } .printContent { max-width: 190mm; } .paperHeader { .paperTitle { font-size: 26px !important; } .examInfo { .infoItem { font-size: 15px; } } } .questionGroup { .groupHeader { .groupTitle { font-size: 17px; } } } .questionItem { .questionContent { span { font-size: 14px; } } } } // 响应式设计 - PC端 @media (min-width: 1025px) { .container { padding: 24px; } .printContent { max-width: 210mm; padding: 0 20px; } .actionBar { padding: 20px 0; } .paperHeader { .paperTitle { font-size: 28px !important; } .examInfo { .infoItem { font-size: 16px; } } } }