60 lines
1.5 KiB
HTML
60 lines
1.5 KiB
HTML
<!DOCTYPE html>
|
|
<html xmlns:th="http://www.thymeleaf.org">
|
|
<head>
|
|
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
|
|
<title>分析画面</title>
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
</head>
|
|
<body>
|
|
|
|
<h2 class="text-center">支出分析</h2>
|
|
|
|
<table class="table text-center">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col">カテゴリ別</th>
|
|
<th scope="col">支出</th>
|
|
<th scope="col">前月比</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<th scope="row">総支出</th>
|
|
<td>￥234,000</td>
|
|
<td>+￥38,000</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
<hr class="border border-primary border-2 opacity-50">
|
|
|
|
<table class="table text-center">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col">カテゴリ別</th>
|
|
<th scope="col">支出</th>
|
|
<th scope="col">前月比<br>コース比</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<th scope="row">食費</th>
|
|
<td>￥34,000</td>
|
|
<td>+￥8,000<br>+￥1,100</td>
|
|
</tr>
|
|
<tr>
|
|
<th scope="row">交通費</th>
|
|
<td>￥14,000</td>
|
|
<td>+￥8,000<br>+￥1,100</td>
|
|
</tr>
|
|
<tr>
|
|
<th scope="row">日用品</th>
|
|
<td>￥4,000</td>
|
|
<td>+￥8,000<br>+￥1,100</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/js/bootstrap.bundle.min.js"></script>
|
|
</body>
|
|
</html> |