<div class="wrap">
<table>
<tr>
<th>名前</th>
<td>田中花子</td>
</tr>
<tr>
<th>性別</th>
<td>女性</td>
</tr>
<tr>
<th>年齢</th>
<td>20</td>
</tr>
<tr>
<th>誕生日</th>
<td>2000/01/01</td>
</tr>
<tr>
<th>好きな食べ物</th>
<td>りんご</td>
</tr>
</table>
</div>
.wrap{
background-image: linear-gradient(180deg, rgba(0, 255, 243, 1), rgba(229, 156, 155, 1) 64%, rgba(252, 146, 146, 1));
padding: 20px 0;
}
table{
border-collapse: collapse;
}
th,td{
padding: 10px 20px;
background:rgba(255,255,255,0.6);
border: 2px solid transparent;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.