css炫酷的按钮样式表
时间: 2023-06-11 10:10:00 浏览: 189
以下是一些 CSS 炫酷的按钮样式表,供参考:
1. 渐变背景色按钮样式
```css
button.gradient-button {
background: linear-gradient(to right, #ff416c, #ff4b2b);
border: none;
color: #fff;
padding: 10px 25px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
border-radius: 50px;
box-shadow: 0 4px 15px 0 rgba(255, 65, 108, 0.75);
}
```
2. 圆形按钮样式
```css
button.circle-button {
width: 50px;
height: 50px;
background: #d92027;
color: #fff;
border: none;
border-radius: 50%;
font-size: 24px;
cursor: pointer;
box-shadow: 0 4px 15px 0 rgba(217, 32, 39, 0.75);
}
```
3. 立体按钮样式
```css
button.embossed-button {
background: #fff;
border: none;
color: #000;
padding: 10px 25px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
border-radius: 50px;
box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1), inset 0 -5px 12px rgba(255, 255, 255, 0.3);
}
```
希望这些样式表能够帮到你。
阅读全文