程序员最近都爱上了这个网站  程序员们快来瞅瞅吧!  it98k网:it98k.com

本站消息

站长简介/公众号

  出租广告位,需要合作请联系站长


+关注
已关注

分类  

暂无分类

标签  

暂无标签

日期归档  

暂无数据

带渐变的对角背景效果(渐变中的渐变)

发布于2022-07-05 07:32     阅读(297)     评论(0)     点赞(24)     收藏(1)


我想将背景对角分割成两种颜色,一种是白色。我希望另一个是从红色到蓝色的渐变。

这里我们有白色背景的红色分割(来源):

body {
  height:100vh;
  width:100vw;
  background:linear-gradient(160deg, red, red 60%, white 60%, white);
}

是否可以使红色部分成为渐变,从红色变为蓝色,例如:

在此处输入图像描述

所以基本上,渐变中的渐变。


解决方案


是的,你可以。使用给定的 css:

  height:100vh;
  width:100vw;
  background:linear-gradient(90deg, red , purple 60%, blue 100%);
  clip-path: polygon(0% 0%,100% 0%,100% 30%,0% 100%);

首先用渐变填充它,然后剪辑它。




所属网站分类: 技术文章 > 问答

作者:黑洞官方问答小能手

链接:http://www.qianduanheidong.com/blog/article/379550/b79e2f567b4dbf32938e/

来源:前端黑洞网

任何形式的转载都请注明出处,如有侵权 一经发现 必将追究其法律责任

24 0
收藏该文
已收藏

评论内容:(最多支持255个字符)