body { background-color: #f2f2f2; font-family: "Microsoft YaHei", Arial, sans-serif; } .container { padding: 20px; width: 99%; margin: 0 auto; } .page-header { margin-bottom: 20px; } .page-title { font-size: 24px; font-weight: bold; color: #333; margin: 0; padding-bottom: 10px; border-bottom: 0px solid #1e9fff; } .project-info-section { background: white; padding: 20px; border-radius: 6px; margin-bottom: 20px; box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1); } .info-grid { display: flex; flex-direction: column; gap: 15px; } .info-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; } .info-item { display: flex; align-items: center; font-size: 14px; color: #666; } .info-label { margin-right: 10px; min-width: 120px; color: #666; } .info-value { color: #333; font-weight: 500; } .section { background: white; border-radius: 6px; margin-bottom: 20px; box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1); } .section-header { padding: 15px 5px; border-bottom: 1px solid #e6e6e6; position: relative; margin-left: 10px; } .section-header::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 4px; height: 20px; background: #1e9fff; } .section-title { font-size: 16px; font-weight: bold; color: #333; margin-left: 15px; } .section-content { padding: 10px 10px 60px 10px; } .search-bar { margin-bottom: 20px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .name-link { color: #1e9fff; text-decoration: none; cursor: pointer; margin-right: 10px; } .name-link:hover { text-decoration: underline; } /* DataTables样式调整 */ .dataTables_wrapper { margin-top: 20px; } .dataTables_length { margin-bottom: 20px; } .dataTables_filter { margin-bottom: 20px; } .dataTables_info { padding-top: 8px; } .dataTables_paginate { padding-top: 8px; } table.dataTable { border-collapse: collapse; width: 100% !important; } table.dataTable thead th { background-color: #f8f8f8; font-weight: 600; border-bottom: 1px solid #ddd; padding: 12px 8px; } table.dataTable tbody td { padding: 10px 8px; border-bottom: 1px solid #eee; } table.dataTable tbody tr:hover { background-color: #f5f5f5; } /* 响应式设计 */ @media (max-width: 768px) { .info-row { grid-template-columns: 1fr; gap: 10px; } .search-bar { flex-direction: column; align-items: stretch; } .search-bar input, .search-bar select { width: 100%; margin-bottom: 10px; } }