html写一个九九乘法表
时间: 2023-12-26 19:06:48 浏览: 160
<!DOCTYPE html>
<html>
<head>
<title>九九乘法表</title>
</head>
<body>
<h1>九九乘法表</h1>
<table border="1">
<tr>
<th></th>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
<th>5</th>
<th>6</th>
<th>7</th>
<th>8</th>
<th>9</th>
</tr>
<?php for($i=1;$i<=9;$i++){ ?>
<tr>
<th><?php echo $i ?></th>
<?php for($j=1;$j<=$i;$j++){ ?>
<td><?php echo $j.'x'.$i.'='.$i*$j ?></td>
<?php } ?>
</tr>
<?php } ?>
</table>
</body>
</html>
相关问题
用html写一个九九乘法表
好的,以下是用 HTML 写一个九九乘法表的示例代码:
```html
<!DOCTYPE html>
<html>
<head>
<title>Multiplication Table</title>
<style>
table {
border-collapse: collapse;
margin: 0 auto;
font-size: 16px;
text-align: center;
}
th,
td {
border: 1px solid #ccc;
padding: 10px;
}
th {
background-color: #f1f1f1;
}
</style>
</head>
<body>
<table>
<thead>
<tr>
<th>*</th>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
<th>5</th>
<th>6</th>
<th>7</th>
<th>8</th>
<th>9</th>
</tr>
</thead>
<tbody>
<tr>
<th>1</th>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
<td>8</td>
<td>9</td>
</tr>
<tr>
<th>2</th>
<td>2</td>
<td>4</td>
<td>6</td>
<td>8</td>
<td>10</td>
<td>12</td>
<td>14</td>
<td>16</td>
<td>18</td>
</tr>
<tr>
<th>3</th>
<td>3</td>
<td>6</td>
<td>9</td>
<td>12</td>
<td>15</td>
<td>18</td>
<td>21</td>
<td>24</td>
<td>27</td>
</tr>
<tr>
<th>4</th>
<td>4</td>
<td>8</td>
<td>12</td>
<td>16</td>
<td>20</td>
<td>24</td>
<td>28</td>
<td>32</td>
<td>36</td>
</tr>
<tr>
<th>5</th>
<td>5</td>
<td>10</td>
<td>15</td>
<td>20</td>
<td>25</td>
<td>30</td>
<td>35</td>
<td>40</td>
<td>45</td>
</tr>
<tr>
<th>6</th>
<td>6</td>
<td>12</td>
<td>18</td>
<td>24</td>
<td>30</td>
<td>36</td>
<td>42</td>
<td>48</td>
<td>54</td>
</tr>
<tr>
<th>7</th>
<td>7</td>
<td>14</td>
<td>21</td>
<td>28</td>
<td>35</td>
<td>42</td>
<td>49</td>
<td>56</td>
<td>63</td>
</tr>
<tr>
<th>8</th>
<td>8</td>
<td>16</td>
<td>24</td>
<td>32</td>
<td>40</td>
<td>48</td>
<td>56</td>
<td>64</td>
<td>72</td>
</tr>
<tr>
<th>9</th>
<td>9</td>
<td>18</td>
<td>27</td>
<td>36</td>
<td>45</td>
<td>54</td>
<td>63</td>
<td>72</td>
<td>81</td>
</tr>
</tbody>
</table>
</body>
</html>
```
你可以将这段代码复制到代码编辑器中并保存为 `.html` 文件,然后在浏览器中打开,即可看到一个简单的九九乘法表。
HTML循环嵌套写一个九九乘法表
HTML可以结合一些简单的CSS样式来创建一个九九乘法表,通过嵌套`<tr>`(行)和`<td>`(单元格)标签来实现。这里是一个基本的例子:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<style>
table {
border-collapse: collapse;
width: 400px;
}
td {
border: 1px solid black;
padding: 5px;
text-align: center;
}
tr:nth-child(even) {background-color: #f2f2f2;}
</style>
</head>
<body>
<table>
<!-- 开始第一列 -->
<tr>
<td>1</td>
<?php for($i = 2; $i <= 9; $i++): ?>
<td><?php echo $i; ?></td>
<?php endfor; ?>
</tr>
<!-- 遍历剩下的行 -->
<?php for($i = 2; $i <= 9; $i++): ?>
<tr>
<td><?php echo $i; ?></td>
<?php for($j = 1; $j <= $i; $j++): ?>
<td><?php echo $j . '*' . $i . ' = ' . ($j * $i); ?></td>
<?php endfor; ?>
</tr>
<?php endfor; ?>
</table>
</body>
</html>
```
这个例子使用了PHP的循环结构来动态生成每个乘积。请注意,实际运行此代码需要服务器环境支持PHP。如果你只想看静态展示,可以把PHP部分去掉,只保留HTML结构。
阅读全文