html - 从右到左的线性渐变

.myStyle{
border: 0;
  height: 40px;
  background: linear-gradient(45deg, transparent 40px, pink 40px);
  padding-left: 56.5691px; /* 40 × √2 ≈ 56.5691 */
}

上面的代码将帮助我进行如下设计：



但是，我想使用相同的代码进行如下设计：



我怎么可能使用相同的技术呢？

最佳答案

border: 0;
height: 40px;
background: linear-gradient(-135deg, transparent 40px, #e8aa36 40px);
padding-left: 56.5691px; /* 40 × √2 ≈ 56.5691 */

这是一支笔：https://codepen.io/joseph-mueller/pen/jwdVyX?editors=1100#

关于html - 从右到左的线性渐变，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/45071442/