首页HTML➕CSS 写九九乘法表

HTML➕CSS 写九九乘法表

时间: 2024-10-18 17:13:38 浏览: 36

HTML和CSS可以组合起来创建美观的网页布局，包括显示九九乘法表。下面是一个简单的示例： ```html <!DOCTYPE html> <html lang="zh-8"> <title>九九乘法表</title> <style> table { width: 100%; border-collapse: collapse; } th, td { border: 1px solid black; padding: 5px; text-align: center; } th { background-color: #f2f2f2; } tr:nth-child(even) { background-color: #e6e6e6; } </style> </head> <body> <table> <thead> <tr> <th></th> <?php for ($i = 1; $i <= 9; $i++): ?> <th><?php echo $i; ?></th> <?php endfor; ?> </tr> </thead> <tbody> <?php for ($i = 1; $i <= 9; $i++): ?> <tr> <th><?php echo $i; ?></th> <?php for ($j = 1; $j <= $i; $j++): ?> <td><?php echo $j . " * " . $i . " = " . ($j * $i); ?></td> <?php endfor; ?> </tr> <?php endfor; ?> </tbody> </table> </body> </html> ``` 这个例子中，HTML用于结构化表格，CSS负责样式，PHP部分则动态生成了乘法规则。你可以将上述代码复制到一个`.html`文件中，并通过浏览器查看效果。

阅读全文