css小三角文字平移加旋转

 

 

<view class="sanjiao">
              <view class="slanted-text">饿了么</view>
            </view>

 

 

/* 三角 */
.sanjiao {
  width: 0;
  height: 0;
  border-left: 40px solid transparent;
  border-right: 40px solid red;
  border-bottom: 40px solid transparent;
  position: absolute;
  right: 0;
  top: 0;
  color: #fff;
  font-size: 20rpx;
}
/* 倾斜文字 再平移*/
.slanted-text {
  transform: translateX(10px) translateY(5px) rotate(40deg);
  display: inline-block;
  white-space: nowrap;
}