Skip to content

J
jianchayuan
Commit 062fd4b3 authored by liuqing's avatar liuqing
Browse files
Options

Merge branch 'master' of http://180.168.156.211:2903/liuqing/jianchayuan

parents 392bc485 151084fd
Show whitespace changes
Inline Side-by-side
Showing with 98 additions and 105 deletions
plandirectory/commonmodel.html
View file @ 062fd4b3
...@@ -4,9 +4,13 @@ ...@@ -4,9 +4,13 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.2.3/css/bootstrap.min.css" rel="stylesheet">
<script src="../static/js/jquery-1.8.1.min.js" type=text/javascript></script> <script src="../static/js/jquery-1.8.1.min.js" type=text/javascript></script>
<script src="../static/js/rem.js"></script> <script src="../static/js/rem.js"></script>
<script src="../static/js/jquery.min.js"></script>
<script src="../static/js/popper.min.js"></script>
<script src="../static/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="../static/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="../static/css/modal.css" />
<link rel="stylesheet" type="text/css" href="../static/css/common.css" /> <link rel="stylesheet" type="text/css" href="../static/css/common.css" />
<link rel="stylesheet" type="text/css" href="../static/css/workshop.css" /> <link rel="stylesheet" type="text/css" href="../static/css/workshop.css" />
<link rel="stylesheet" type="text/css" href="../static/css/commonArea.css" /> <link rel="stylesheet" type="text/css" href="../static/css/commonArea.css" />
...@@ -21,103 +25,6 @@ ...@@ -21,103 +25,6 @@
background-size: cover; background-size: cover;
} }
/* 修改背景图片 */
.content {
background: url('../static/images/bg.jpg') no-repeat;
width: 100%;
min-height: 100vh;
background-size: cover;
}
/* 修改模态框样式 */
.modal-dialog {
background-image: url("../static/images/tc_bj.png");
/* 替换为你的背景图片路径和名称 */
background-size: cover;
/* 自动适应尺寸并覆盖整个模态框 */
background-repeat: no-repeat;
/* 防止重复平铺 */
width: 75%;
/* 设置模态框宽度为屏幕的一半 */
height: 68vh;
/* 设置模态框高度为屏幕高度的一半 */
max-width: 1200px;
/* 设置最大宽度 */
max-height: 700px;
/* 设置最大高度 */
}
/* 修改模态框样式 */
.modal-content {
background-color: #00254d00;
border: none;
}
.modal-title {
font-family: 'PingFang-SC-Bold';
font-size: 26px;
font-weight: normal;
font-stretch: normal;
letter-spacing: 1px;
color: #ffffff;
}
.modal-body {
display: flex;
padding: 30px;
}
#cameraText {
width: 50%;
/* 修改左侧文字占比 */
padding: 20px;
/* 修改文字内边距 */
}
#cameraText p {
margin-bottom: 10px;
/* 修改段落之间的间距 */
}
#cameraVideo {
width: 50%;
/* 修改右侧视频占比 */
padding: 0 10px;
/* 修改视频内边距 */
}
#cameraVideo video {
width: 100%;
/* 修改视频宽度 */
outline: none;
/* 去掉视频播放器的外边框 */
}
.modal-content .title {
text-align: center;
line-height: 40px;
margin-top: 20px;
font-size: 0.25rem;
}
.modal-body ul {
margin-left: 20px;
margin-top: 10px;
}
.modal-body ul li {
height: 40px;
font-size: 16px;
cursor: pointer;
}
.modal-body ul li span {
margin-left: 10px;
font-size: 0.2rem;
color: #eee;
}
.padding_box { .padding_box {
padding: 0.12rem 0.7rem padding: 0.12rem 0.7rem
} }
...@@ -439,7 +346,7 @@ ...@@ -439,7 +346,7 @@
<div class="modal-body"> <div class="modal-body">
<!-- 左侧文字 --> <!-- 左侧文字 -->
<div style="float:left; width:15%;"> <div style="width:15%;">
<!-- 这里放置动态加载的文本，例如摄像头信息 --> <!-- 这里放置动态加载的文本，例如摄像头信息 -->
<ul> <ul>
<li><img src="../static/images/sp_icon.png"><span>监控1001</span></li> <li><img src="../static/images/sp_icon.png"><span>监控1001</span></li>
...@@ -450,7 +357,7 @@ ...@@ -450,7 +357,7 @@
</ul> </ul>
</div> </div>
<!-- 右侧视频 --> <!-- 右侧视频 -->
<div style="float:right; width:85%;" id="cameraVideo"> <div style="flex: 1;" id="cameraVideo">
<div id="new_data"></div> <div id="new_data"></div>
<video width="100%" controls poster="../static/images/sp_model.png"> <video width="100%" controls poster="../static/images/sp_model.png">
<source src="视频文件路径/URL" type="video/mp4"> <!-- 修改为你的视频文件路径或URL --> <source src="视频文件路径/URL" type="video/mp4"> <!-- 修改为你的视频文件路径或URL -->
...@@ -506,11 +413,7 @@ ...@@ -506,11 +413,7 @@
</div> </div>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js"></script> <script>
<script src="https://cdn.bootcdn.net/ajax/libs/popper.js/2.10.2/umd/popper.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.2.3/js/bootstrap.min.js"></script>
<script>
// 关闭模态框 // 关闭模态框
$('#cameraModal').on('hidden.bs.modal', function (e) { $('#cameraModal').on('hidden.bs.modal', function (e) {
......
static/css/modal.css 0 → 100644
View file @ 062fd4b3
/* 修改模态框样式 */
.modal-dialog {
/* 防止重复平铺 */
width: 75%;
/* 设置模态框宽度为屏幕的一半 */
height: 68vh;
/* 设置模态框高度为屏幕高度的一半 */
max-width: 1200px;
/* 设置最大宽度 */
max-height: 700px;
/* 设置最大高度 */
}
/* 修改模态框样式 */
.modal-content {
background-image: url("../images/tc_bj.png");
/* 替换为你的背景图片路径和名称 */
background-size: cover;
/* 自动适应尺寸并覆盖整个模态框 */
background-repeat: no-repeat;
/* background-color: #00254d00; */
border: none;
background-color: transparent;
}
.modal-title {
font-family: 'PingFang-SC-Bold';
font-size: 26px;
font-weight: normal;
font-stretch: normal;
letter-spacing: 1px;
color: #ffffff;
}
.modal-body {
display: flex;
padding: 30px;
}
#cameraText {
width: 50%;
/* 修改左侧文字占比 */
padding: 20px;
/* 修改文字内边距 */
}
#cameraText p {
margin-bottom: 10px;
/* 修改段落之间的间距 */
}
#cameraVideo {
width: 50%;
/* 修改右侧视频占比 */
padding: 0 10px;
/* 修改视频内边距 */
}
#cameraVideo video {
width: 100%;
/* 修改视频宽度 */
outline: none;
/* 去掉视频播放器的外边框 */
}
.modal-content .title {
text-align: center;
line-height: 40px;
margin-top: 20px;
font-size: 0.25rem;
}
.modal-body ul {
margin-left: 20px;
margin-top: 10px;
}
.modal-body ul li {
height: 40px;
font-size: 16px;
cursor: pointer;
}
.modal-body ul li span {
margin-left: 10px;
font-size: 0.2rem;
color: #eee;
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment