用web代码打出纯色按钮,自定义样式提交按钮,大文本框,完全响应设计,圆边框
时间: 2023-11-20 11:05:55 浏览: 41
您可以使用以下的 HTML 和 CSS 代码来实现您的要求:
```html
<button class="color-button">纯色按钮</button>
<button class="custom-button">自定义样式提交按钮</button>
<textarea class="text-area" placeholder="大文本框"></textarea>
```
```css
/* 纯色按钮样式 */
.color-button {
background-color: #f2f2f2;
border: none;
border-radius: 20px;
color: #333;
font-size: 16px;
padding: 10px 20px;
cursor: pointer;
}
/* 自定义样式提交按钮样式 */
.custom-button {
background-color: #4CAF50;
border: none;
border-radius: 20px;
color: white;
font-size: 16px;
padding: 10px 20px;
cursor: pointer;
}
/* 完全响应式设计 */
@media screen and (max-width: 768px) {
.color-button,
.custom-button,
.text-area {
width: 100%;
}
}
/* 圆边框样式 */
.color-button,
.custom-button,
.text-area {
border-radius: 20px;
}
```
您可以将以上代码复制到您的 HTML 和 CSS 文件中,并进行相应的修改以适应您的需求。