首页给我一段用html和ccs写的web美化表格，要求顶部有输入框和提交按钮，下面是表格

给我一段用html和ccs写的web美化表格，要求顶部有输入框和提交按钮，下面是表格

时间: 2024-04-14 15:26:15 浏览: 23

当然可以！以下是一个使用 HTML 和 CSS 美化的简单示例，其中包含顶部的输入框和提交按钮，以及下面的表格： ```html <!DOCTYPE html> <html> <head> <style> /* 表格样式 */ table { width: 100%; border-collapse: collapse; } th, td { padding: 8px; text-align: left; border-bottom: 1px solid #ddd; } /* 输入框和按钮样式 */ .container { margin-top: 20px; } input[type=text], input[type=submit] { padding: 6px; width: 200px; } input[type=submit] { background-color: #4CAF50; color: white; cursor: pointer; } input[type=submit]:hover { background-color: #45a049; } </style> </head> <body> <div class="container"> <input type="text" placeholder="在此输入内容"> <input type="submit" value="提交"> </div> <table> <tr> <th>标题1</th> <th>标题2</th> <th>标题3</th> </tr> <tr> <td>数据1</td> <td>数据2</td> <td>数据3</td> </tr> <tr> <td>数据4</td> <td>数据5</td> <td>数据6</td> </tr> </table> </body> </html> ``` 你可以将以上代码保存为一个 HTML 文件并在浏览器中打开，就可以看到美化的表格了。顶部有一个输入框和提交按钮，下面是一个简单的表格。你可以根据需要修改样式和内容。希望对你有所帮助！