html, body { height: 100%; color: #222; } .logo{ height: 36px; } #bg { background: url("./img2/bg.jpg") no-repeat; background-size: contain; height: 100%; } .fiveG, .shexiangtou { border-radius: 6px; } .topWindows { position: absolute; top: 0; left: 0; right: 0; padding: 10px 16px; height: 56px; background-color: #fff; box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15); } .topBox { display: flex; justify-content: space-between; align-items: center; align-self: center; } .topLeft{ height: 36px; overflow: hidden; } .topCenter { display: flex; justify-content: space-around; background-color: #F0F2F5; border-radius: 4px; } .topCenter > div { text-align: center; width: 120px; height: 36px; line-height: 36px; } .fiveG { position: absolute; left: 36px; bottom: 24px; /* width: calc(100% - 360px - 88px); */ width: 900px; height: 172px; background: #fff; box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15); transition: height 0.3s ease; overflow: scroll; border-radius: 6px; } .shexiangtou { position: absolute; display: flex; flex-direction: column; right: 36px; height: calc(100% - 104px); bottom: 24px; width: 360px; background: #fff; box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15); transition: height 0.3s ease; overflow: scroll; border-radius: 6px; } .collapsed { height: 40px; /* 折叠后的高度 */ } .collapsed span:first-child { position: absolute; } .title_head { height: 40px; font-size: 16px; font-weight: 700; line-height: 16px; background-color: #fff; padding: 12px 16px; position: sticky; top: 0; } .title_head > .change1, .title_head > .change2 { width: 18px; height: 18px; border: none; cursor: pointer; } .left { float: left; } .right { float: right; } .circle { width: 100%; background-color: white; font-size: 12px; } #myTable { overflow: scroll; width: 100%; border-collapse: collapse; /* 移除表格单元格之间的间隙 */ box-sizing: border-box; /* 确保边框和内边距包含在总宽度和高度内 */ } #myTable th, #myTable td { border-bottom: 1px solid #eee; /* 添加边框以更好地显示表格结构(可选) */ padding: 0 10px; /* 添加内边距以提高可读性(可选) */ box-sizing: border-box; /* 确保单元格的边框和内边距包含在总宽度和高度内 */ height: 32px; line-height: 32px; font-size: 12px; text-align: left; } #myTable th { background: #f3f5f7; font-weight: 700; } #myTable td.blue{ background: rgba(8, 102, 255, .1); } #myTable td.orange{ background: rgba(254, 143, 13, .1); } #myTable td.green{ background: rgba(34, 158, 46, .1); } #thead tr{ position: sticky; top: 40px; } .list_data { width: 65%; height: 150px; margin: 10px; background-color: aqua; } .video { padding: 0; height: 260px; margin-bottom: 2px; } .video img { width: 360px; height: 260px; border: 0; margin: 0; } .leida { height: 128px; display: flex; gap: 2px; margin-bottom: 3px; } .leida > .leida_v{ flex: 1; height: 128px; } .one_info { display: flex; flex-direction:row; flex-wrap: wrap; background: #fff; } .one_info > div { width: 33.3333333%; padding: 12px 0; text-align: center; } .one_info span { display: block; } .one_info span.info_title{ font-size: 13px; line-height: 13px; color: #70757A; margin-bottom: 4px; } .one_info span.info_content{ font-size: 16px; line-height: 16px; font-weight: 400; color: #222; } .list_info { flex: 1; background-color: #fff; box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.15); } .list_info img{ width: 250px; margin: 20px 55px; } .category_box { cursor: pointer; } .category_box.active { background-color: #0866FF; color: #fff; border-radius: 4px; box-shadow: 0 3px 4px rgba(0, 0, 0, 0.25); } .xs_box{ position: fixed; display: flex; flex-direction: column; justify-content: space-between; text-align: center; align-items: center; top: 80px; bottom: 24px; width: 12px; background: url("./img2/xs_bg.png") repeat-y; background-position-x: center; } .xs_box .xs_t{ width: 12px; height: 20px; } .xs_box .xs_c{ width: 2px; height: 96px; } .xs_box .xs_b{ width: 12px; height: 20px; } .xs_box_left{ left: 12px; } .xs_box_right{ right: 12px; } /* 、popup弹窗样式 */ #lblStartTime{ color: #0866FF; }