带一个削角的CSS特殊形状[重复]

Question

此问题已经在这里有了答案：

Cut Corners using CSS（13个回答）

关闭9分钟前。

[我尝试制作一个剃了一个角的按钮，我在网上搜索，但是找不到创建它的方法。

我尝试的是以下CSS代码：

   #button {
  border-bottom: 100px solid red;
  border-left: 25px solid transparent;
  height: 0;
  width: 100px;
}

但是如您所见，它确实是..：

任何帮助都会很棒

Answer 1

您是否考虑过使用剪切路径？You can try this

.path {
  clip-path: polygon(28% 0, 100% 0, 100% 100%, 0 100%, 0 29%);
  width: 100px;
  height: 60px;
  background-color: tomato;
}

<div class="path"></div>