首页用html编写，姓名：方框换行留言：方框，在下面有黑色边框的绿色按钮“提交”，可以交互

用html编写，姓名：方框换行留言：方框，在下面有黑色边框的绿色按钮“提交”，可以交互

时间: 2024-10-13 20:03:11 浏览: 20

在HTML中，你可以使用`<form>`标签创建一个包含姓名输入、换行以及留言输入框，并配合CSS样式添加一个带有黑色边框的绿色按钮。以下是示例代码： ```html <!DOCTYPE html> <html lang="zh"> <head> <style> input[type="text"], textarea { width: 200px; height: 40px; } #message-box { border: 1px solid black; padding: 5px; } button.green-btn { background-color: green; color: white; border: none; padding: 10px 20px; cursor: pointer; } </style> </head> <body> <form> <label for="name">姓名：</label><br> <input type="text" id="name" name="name"><br> <textarea id="message-box" rows="5" placeholder="留言："></textarea><br> <button class="green-btn" type="submit">提交</button> </form> </body> </html> ``` 在这个例子中： - `input[type="text"]` 创建了一个文本输入框用于输入姓名。 - `textarea` 提供了长文本输入区域，用户可以输入留言。 - `.green-btn` 是一个CSS类，用于设置按钮的颜色和外观。当用户点击绿色按钮时，表单数据默认会被提交（假设后端服务器已经处理）。如果你想实现更复杂的交互，比如JavaScript事件处理，需要额外的脚本支持。

阅读全文