css3 统计表 html

CSS3 是一种用于网页设计的样式表语言，提供了许多新的功能和选项，其中最令人兴奋的功能之一是支持创建漂亮的统计表。这篇文章将介绍如何使用 HTML 和 CSS3 创建一个简单的统计表。

table>
    thead>
    tr>
    th>
    月份/th>
    th>
    销售额/th>
    /tr>
    /thead>
    tbody>
    tr>
    td>
    1月/td>
    td>
    1000/td>
    /tr>
    tr>
    td>
    2月/td>
    td>
    1500/td>
    /tr>
    tr>
    td>
    3月/td>
    td>
    2000/td>
    /tr>
    tr>
    td>
    4月/td>
    td>
    2500/td>
    /tr>
    /tbody>
    /table>

这是我们的 HTML 代码，它创建了一个包含表头和表体的简单表格。接下来，我们将使用 CSS3 为表格添加样式。

table {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #ccc;
    margin-bottom: 20px;
}
th, td {
    text-align: left;
    padding: 8px;
}
thead {
    background-color: #f5f5f5;
}
tbody tr:nth-child(even) {
    background-color: #f9f9f9;
}
    

这是我们的 CSS3 代码。它定义了表格的宽度，边框样式，内边距和对齐方式。它还定义了表头和表体的背景颜色，以及奇偶行的背景颜色。

现在我们的统计表已经完成了。通过简单的 HTML 和 CSS3，我们已经创造了一个漂亮的统计表，使数据变得更有意义和易于理解。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！