.boxBody { width: 100%; height: 100%; position: relative; padding: 10px; } .boxBody .boxTop { display: flex; align-items: center; justify-content: space-around; width: 640px; height: 100px; margin: 0 auto; } .boxBody .boxTop .boxFlex { width: 200px; display: flex; align-items: center; flex-wrap: wrap; flex-direction: column; position: relative; } .boxBody .boxLeft { width: 180px; height: 320px; display: flex; flex-wrap: wrap; flex-direction: column; position: absolute; justify-content: space-between; left: 10px; top: 130px; text-align: center; } .boxBody .boxRight { width: 180px; height: 320px; display: flex; flex-wrap: wrap; justify-content: space-between; flex-direction: column; position: absolute; right: 10px; top: 130px; text-align: center; } .boxBody .boxBottom { width: 500px; height: 380px; position: absolute; top: 130px; left: 50%; transform: translateX(-50%); } .boxBody .boxBottom .svgBox { width: 100%; height: 250px; background-color: #9AFF9A; } .boxBody .boxBottom .content { width: 100%; height: 130px; } .boxBody .boxBottom .content :global .ant-select-selector { color: #333; } .boxBody .boxBottom .content :global .ant-select-selection-item { color: #333 !important; /* 选择框文字颜色 */ padding-left: 50px; line-height: 40px; } .boxBody .boxTitle { background-color: #3399ff; color: #fff; width: 180px; height: 20px; line-height: 20px; text-align: center; } .boxBody :global .mySelects .ant-select-selector { background-color: #99CCFF !important; /* 选择框背景色 */ height: 40px !important; /* 选择框高度 */ } .boxBody :global .mySelects .ant-select-selection-item { color: transparent !important; /* 选择框文字颜色 */ } .boxBody .mySelects { position: relative; } .boxBody .boxInput { display: flex; align-items: center; justify-content: space-between; width: 180px; height: 40px; position: relative; } .boxBody .boxInput :global .ant-input { background-color: #99CCFF !important; /* 输入框背景色 */ border: 1px solid #d9d9d9; height: 40px; } .boxBody .text { background-color: #99CCFF; width: 100%; height: 40px; line-height: 40px; text-align: center; font-size: 10px; margin-right: 1px; } .boxBody .content :global .ant-input { background-color: #EEEEEE !important; /* 输入框背景色 */ height: 40px; } .boxBody .content :global .ant-select-selector { background-color: #EEEEEE !important; /* 选择框背景色 */ height: 40px !important; /* 选择框高度 */ } .boxBody .content .text { background-color: #EEEEEE; margin: 0; } .boxBody .content .boxFlex { display: flex; align-items: center; flex-wrap: wrap; flex-direction: column; width: 500px; } .boxBody .content .boxFlexs { display: flex; align-items: center; width: 500px; justify-content: space-between; } .boxBody .content .boxFlexs .boxInputs { display: flex; align-items: center; flex: 1; } .boxBody .content .boxFlexs .boxInputs :global .ant-input { background-color: #EEEEEE !important; /* 输入框背景色 */ height: 40px; } .boxBody .content .boxInput { width: 100%; position: relative; } .boxBody .content .boxInput .defaultValue { position: absolute; left: 32%; top: 3px; width: 60px; height: 30px; background-color: #EEE; color: #333; line-height: 40px; z-index: 2; text-align: center; }