提交按钮设置好看的样式
时间: 2023-07-31 14:05:47 浏览: 47
要设置提交按钮的好看样式,您可以使用CSS样式表中的样式来设置。以下是一些示例样式代码,您可以根据需要进行调整:
1.设置按钮的背景颜色、文字颜色和边框样式:
```
button {
background-color: #4CAF50; /* 设置背景颜色 */
color: white; /* 设置文字颜色 */
border: none; /* 去掉边框 */
padding: 10px 20px; /* 设置内边距 */
text-align: center; /* 文字居中 */
text-decoration: none; /* 去掉下划线 */
display: inline-block;
font-size: 16px; /* 设置字体大小 */
margin: 4px 2px; /* 设置外边距 */
cursor: pointer; /* 鼠标指针样式 */
border-radius: 4px; /* 设置圆角 */
}
```
2.设置按钮的悬停效果:
```
button:hover {
background-color: #3e8e41; /* 设置悬停时的背景颜色 */
}
```
3.设置按钮的按下效果:
```
button:active {
background-color: #3e8e41; /* 设置按下时的背景颜色 */
box-shadow: 0 5px #666; /* 设置按下时的阴影效果 */
transform: translateY(4px); /* 设置按下时的位置偏移 */
}
```
您可以将这些样式代码应用到您的提交按钮中,以达到您想要的好看的样式。