CSS 斜线边框
CSS slash border
如图所示,背景色为洋红色,按钮为白色。
按钮的右下角既不是矩形也不是圆形,而是有点斜线。
我可以使用 CSS 实现吗?
这是新 属性 clip-path
.
的示例
您可以在 https://bennettfeely.com/clippy/ 网站上进行实验
div {
width: 100px;
min-height: 50px;
clip-path: polygon(0 0, 100% 0, 100% 75%, 75% 100%, 0 100%);
background: lightblue;
}
<div class="btn">
button
</div>
如图所示,背景色为洋红色,按钮为白色。 按钮的右下角既不是矩形也不是圆形,而是有点斜线。
我可以使用 CSS 实现吗?
这是新 属性 clip-path
.
您可以在 https://bennettfeely.com/clippy/ 网站上进行实验
div {
width: 100px;
min-height: 50px;
clip-path: polygon(0 0, 100% 0, 100% 75%, 75% 100%, 0 100%);
background: lightblue;
}
<div class="btn">
button
</div>