我希望在CSS中实现这个效果,适用于所有屏幕尺寸:
从屏幕左侧到中间的背景应该是蓝色的,从上中部到右下角的背景应该是白色的。
这是我已经得到的:
这在某些屏幕尺寸上有效,但不是通用解决方案。 我正在寻找仅使用CSS的解决方案。如果这不可能,SVG也可以。 提前感谢您。
![example](https://abload.de/img/zeichenflche1-8ucont.png)
<style>
.wrapper {
position: fixed;
z-index: 1;
width: 100%;
height: 100%;
background: #297fca;
}
.right {
position: fixed;
z-index: 2;
top: -70%;
right: -50%;
background: #fff;
width: 100%;
height: 100%;
transform: translateY(50%) rotate(45deg);
}
</style>
...
<div class="wrapper">
<div class="right">
</div>
</div>
这在某些屏幕尺寸上有效,但不是通用解决方案。 我正在寻找仅使用CSS的解决方案。如果这不可能,SVG也可以。 提前感谢您。