|
|
.right_box{
|
display: none;
|
position: absolute;
|
height: 100%;
|
right: 10px;
|
top: 0;
|
padding-left: 20px;
|
width:66%;
|
transition: right 0.6s ease;
|
}
|
.right_box.open {
|
right: 0;
|
width:66%;
|
}
|
#myIframe{
|
position: absolute;
|
left: 10px;
|
top: 5px;
|
width: 33%;
|
height: 98%;
|
transition: width 0.3s ease;
|
overflow: scroll;
|
border-radius: 6px;
|
border: 0;
|
}
|
.boat_data{
|
width: 65%;
|
height: 98%;
|
position: absolute;
|
right: 0px;
|
bottom: 10px;
|
border-radius: 6px;
|
display: flex;
|
justify-content: space-between;
|
}
|
|
|
|
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;
|
}
|
.wurenji_data{
|
width: 100%;
|
}
|
.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;
|
}
|
|
|
body{
|
width: 100%;
|
margin: 0;
|
}
|
iframe{
|
overflow-y:hidden;
|
}
|
#container{
|
width: 100%;
|
height: 100%;
|
}
|
div{
|
border-radius:6px ;
|
}
|
#button1,#button2{
|
border: 3px solid red;
|
width: 40px;
|
height: 40px;
|
border-radius: 50%;
|
position: absolute;
|
z-index: 10;
|
background-repeat: no-repeat;
|
background-position: center center;
|
background-size: cover;
|
margin: 0;
|
overflow-x: hidden;
|
|
}
|
#button2{
|
background-image: url('./img2/shexiangtou.png');
|
top: 30%;
|
left: 30%;
|
}
|
#button1{
|
background-image: url('./img2/wurenji.png');
|
bottom: 30%;
|
left: 30%;
|
}
|
|
|
|
|
.boat_right,.boat_left{
|
width: 100%;
|
}
|
|
|
.boat_left.hidden {
|
display: none; /* 隐藏boat_left */
|
}
|
|
.boat_right.full-width {
|
width: 100%; /* 无人机模式下boat_right占据全部宽度 */
|
}
|
.boat_right iframe{
|
height: 250px;
|
}
|
.change2{
|
background-image: url('../img2/xiangyou1.png');
|
width: 40px;
|
height: 40px;
|
position: absolute;
|
z-index: 30;
|
left: -34px;
|
top: 10px;
|
background-repeat: no-repeat;
|
background-position: center center;
|
background-size: cover;
|
margin: 0;
|
overflow-x: hidden;
|
/* background-color: aliceblue; */
|
}
|
|
|
/* 、popup弹窗样式 */
|
/* #lblStartTime{
|
color: #0866FF;
|
} */
|
