html日历模块代码

王芹婷 1周前 11浏览 0评论

HTML日历模块是用于在网页上显示日历的代码模块,能够方便地让用户查看对应日期的日程。以下是一个基本的HTML日历模块,代码如下:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>HTML 日历模块</title>
  <style>
    table {
      border: solid black 1px;
      border-collapse: collapse;
    }
    td {
      width: 60px;
      height: 60px;
      border: solid black 1px;
      text-align: center;
      vertical-align: middle;
    }
  </style>
</head>
<body>
  <table>
    <caption>2021 年 9 月 日历</caption>
    <tr>
      <th>日</th>
      <th>一</th>
      <th>二</th>
      <th>三</th>
      <th>四</th>
      <th>五</th>
      <th>六</th>
    </tr>
    <tr>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td>1</td>
      <td>2</td>
    </tr>
    <tr>
      <td>3</td>
      <td>4</td>
      <td>5</td>
      <td>6</td>
      <td>7</td>
      <td>8</td>
      <td>9</td>
    </tr>
    <tr>
      <td>10</td>
      <td>11</td>
      <td>12</td>
      <td>13</td>
      <td>14</td>
      <td>15</td>
      <td>16</td>
    </tr>
    <tr>
      <td>17</td>
      <td>18</td>
      <td>19</td>
      <td>20</td>
      <td>21</td>
      <td>22</td>
      <td>23</td>
    </tr>
    <tr>
      <td>24</td>
      <td>25</td>
      <td>26</td>
      <td>27</td>
      <td>28</td>
      <td>29</td>
      <td>30</td>
    </tr>
  </table>
</body>
</html>

这段代码使用的是HTML标记语言,其中<table>代表表格,<tr>代表表格行,<th>代表表头单元格,<td>代表内容单元格。样式部分使用<style>标记来添加表格的样式,其中的属性可以根据需要进行调节。