首页1.创建一个三行三列的表格（边框粗细为Ipx，表格内容随意填写），一个按钮，当点击按钮时表格的背景颜色变成绿色。

1.创建一个三行三列的表格（边框粗细为Ipx，表格内容随意填写），一个按钮，当点击按钮时表格的背景颜色变成绿色。

时间: 2024-03-23 20:40:55 浏览: 67

好的，以下是代码实现： ```html <!DOCTYPE html> <html> <head> <title>表格背景颜色变绿色</title> <style type="text/css"> table { border: 1px solid black; /* 表格边框粗细为1px */ border-collapse: collapse; /* 合并表格边框 */ background-color: white; /* 表格背景颜色为白色 */ margin: 20px auto; /* 设置表格居中 */ } td { border: 1px solid black; /* 表格单元格边框粗细为1px */ padding: 10px; /* 设置单元格内边距 */ text-align: center; /* 设置单元格内文本居中 */ } button { display: block; /* 将按钮设置为块级元素，使其独占一行 */ margin: 20px auto; /* 设置按钮居中 */ } </style> </head> <body> <table> <tr> <td>1</td> <td>2</td> <td>3</td> </tr> <tr> <td>4</td> <td>5</td> <td>6</td> </tr> <tr> <td>7</td> <td>8</td> <td>9</td> </tr> </table> <button onclick="changeColor()">点击变绿色</button> <script type="text/javascript"> function changeColor() { var table = document.getElementsByTagName("table")[0]; // 获取表格元素 table.style.backgroundColor = "green"; // 将表格背景颜色设置为绿色 } </script> </body> </html> ``` 这是一个简单的 HTML 页面，其中包含了一个三行三列的表格和一个按钮。当点击按钮时，通过 JavaScript 修改表格的背景颜色为绿色。

阅读全文