css留言框
时间: 2023-07-24 13:09:15 浏览: 40
好的,您需要一个CSS样式的留言框,我可以帮您提供一个简单的样式代码,您可以根据自己的需求进行修改:
HTML结构:
```html
<div class="message-box">
<form>
<textarea placeholder="请输入留言内容"></textarea>
<button type="submit">提交留言</button>
</form>
</div>
```
CSS样式:
```css
.message-box {
width: 400px;
margin: 0 auto;
}
.message-box form {
display: flex;
flex-direction: column;
}
.message-box textarea {
height: 100px;
padding: 10px;
font-size: 16px;
border: 1px solid #ccc;
border-radius: 5px;
margin-bottom: 10px;
}
.message-box button {
width: 100px;
height: 40px;
font-size: 16px;
background-color: #007bff;
color: #fff;
border: none;
border-radius: 5px;
cursor: pointer;
}
.message-box button:hover {
background-color: #0062cc;
}
```
您可以将以上代码复制到您的HTML和CSS文件中,然后根据需要进行修改样式。希望能帮到您!
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)