写一个html5的代码,用来展示某一辆车的信息看板,内容为车牌号码、司机名称、工程名称、施工部位、标号、发车方量,黑色背景,重点是界面要高大上、美观、有质感
时间: 2023-06-19 15:34:41 浏览: 47
以下是一个简单的 HTML5 代码示例,用于展示一辆车的信息看板。为了使界面高大上、美观且有质感,我们使用了黑色背景和清晰的字体:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>车辆信息看板</title>
<style>
body {
background-color: black;
color: white;
font-family: Arial, sans-serif;
font-size: 24px;
text-align: center;
padding-top: 50px;
}
h1 {
font-size: 48px;
margin-top: 0;
}
table {
margin: 0 auto;
border-collapse: collapse;
}
th, td {
padding: 10px;
border: 2px solid white;
}
th {
background-color: #333;
}
td {
background-color: #555;
}
</style>
</head>
<body>
<h1>车辆信息看板</h1>
<table>
<tr>
<th>车牌号码</th>
<td>粤A12345</td>
</tr>
<tr>
<th>司机名称</th>
<td>张三</td>
</tr>
<tr>
<th>工程名称</th>
<td>某某工程</td>
</tr>
<tr>
<th>施工部位</th>
<td>地基</td>
</tr>
<tr>
<th>标号</th>
<td>C30</td>
</tr>
<tr>
<th>发车方量</th>
<td>50m³</td>
</tr>
</table>
</body>
</html>
```
这个代码使用了 HTML 表格来展示车辆信息,并使用了 CSS 样式来调整字体、颜色和边框。我们还在页面顶部添加了一个大标题,以便引起注意。整个界面使用黑色背景,使得信息看板更具有冷静、专业的感觉。