ReportGeneration/input/base_template.html

130 lines
3.4 KiB
HTML

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ report_title }}</title>
<style>
body {
font-family: 'Arial', sans-serif;
margin: 0;
padding: 0;
background-color: #f4f4f4;
color: #333;
line-height: 1.6;
}
header {
background: #4CAF50;
color: white;
padding: 20px 0;
text-align: center;
}
header h1 {
margin: 0;
font-size: 2em;
}
nav {
background: #333;
color: white;
overflow: hidden;
}
nav a {
float: left;
/* display: block; */
color: white;
text-align: center;
padding: 14px 20px;
text-decoration: none;
}
nav a:hover {
background-color: #ddd;
color: black;
}
.container {
padding: 20px;
}
h2 {
color: #4CAF50;
font-size: 1.5em;
border-bottom: 2px solid #4CAF50;
padding-bottom: 10px;
margin-bottom: 20px;
}
h3 {
color: #333;
font-size: 1.3em;
margin-bottom: 10px;
}
p {
font-size: 1em;
line-height: 1.6;
margin-bottom: 20px;
}
.section {
margin-bottom: 40px;
}
table {
width: 100%;
border-collapse: collapse;
margin-bottom: 20px;
}
table, th, td {
border: 1px solid #ddd;
}
th, td {
padding: 8px;
text-align: left;
}
th {
background-color: #4CAF50;
color: white;
}
.highlight {
background-color: #ffff99;
}
footer {
background: #333;
color: white;
text-align: center;
padding: 10px 0;
position: relative;
width: 100%;
bottom: 0;
margin-top: 20px; /* 增加顶部边距以避免覆盖内容 */
}
.image-container {
width: 200px;
margin: 0 auto; /* 居中对齐 */
}
.image-container img {
width: 100%;
height: auto; /* 保持纵横比 */
}
</style>
</head>
<body>
<header>
<h1>{{ report_title }}</h1>
</header>
<nav>
<a href="#section1">章节划分</a>
<a href="#section2">静态描述内容</a>
<a href="#section3">动态加载内容</a>
<a href="#section4">报告命名规则</a>
<a href="#section5">版本管理</a>
<a href="#section6">分类属性</a>
<a href="#section7">表格数据</a>
<a href="#section8">高亮内容</a>
<a href="#section9">图片展示</a>
<a href="#section10">联系信息</a>
</nav>
<div class="container">
{% block content %}{% endblock %}
</div>
<footer>
<div>版本信息:{{ version_management.current_version }} - {{ version_management.description }} - {{ version_management.status }}</div>
<div>&copy; eCL3000 报告生成系统</div>
</footer>
</body>
</html>