CSS 平行四边形样式

 

<div class="top-btn">
     <div>四边形</div>
</div>

.top-btn {
  width: 64px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  transform: skewX(-20deg);
  margin-right: 10px;
  font-size: 12px;
  color: #ffffff;
  border-radius: 2px;
  background-color: #ff6600;
}
.top-btn > div {
  transform: skewX(20deg);
}