#header-container { font-size: 32px; font-weight: bold; padding-left: 20px; padding-top: 10px; /* padding-bottom: 5px; */ } /* 设置html和body的高度为100% */ html, body { height: 100%; margin: 0; padding: 0; } /* 使用flexbox布局 */ body { display: flex; flex-direction: column; } /* 主要内容区域,flex-grow: 1使其占据剩余空间 */ .content { flex-grow: 1; /* padding: 20px; */ } /* Footer样式 */ footer { background-color: #f1f1f1; color: rgb(172, 172, 172); text-align: center; padding: 10px 0; } .card { padding: 5px 10px; margin: 5px; border-radius: 8px; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.3); width: 300px; display: inline-block; vertical-align: top; margin: 12px; } .note-info { border-style: solid; border-width: 4px; border-color: #a10000; border-radius: 8px; padding: 6px 10px; margin-top: 4px; margin-bottom: 6px; } .server-name { background-color: rgb(0, 0, 0); color: white; border-radius: 8px; padding: 6px 10px; font-size: 26px; margin-top: 4px; margin-bottom: 6px; } .gpu-info { background-color: aqua; border-style: solid; border-width: 1px; border-color: #ccc; border-radius: 8px; margin-top: 5px; padding: 4px 8px; margin-bottom: 12px; background-color: #f9f9f9; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); } .process-item { color: rgb(26, 92, 247); font-weight: bold; } /*占用状态*/ .state-free { color: green; } .state-occupy { color: red; } .state-light-occupy { color: orange; } .state-super-occupy { color: rgb(255, 0, 0); font-weight: bold; font-size: 20px; background-color: rgb(255, 255, 0); border-radius: 8px; padding: 1px 6px; }