弯曲的线性渐变背景？
[英]Curved linear-gradient background?
问题描述
please excuse my horrible paint drawing but I don't really know how else to describe what I am looking for.
请原谅我可怕的绘画，但我真的不知道如何描述我正在寻找的东西。 I currently have a box with a background that is utilizing a linear-gradient我目前有一个使用线性渐变的背景框
`linear-gradient(330deg, white 30%, grey 45%, white 0)`
It looks similar to the terrible illustration.它看起来类似于可怕的插图。 However, my project needs a slight curve, which obviously the linear gradient cannot supply.但是，我的项目需要一个轻微的曲线，显然线性渐变无法提供。 Is there anyway to change that linear gradient such that there is a slight curve down the diagonal line?无论如何要改变线性梯度，使得对角线下方有一条轻微的曲线？
What I have: linear-gradient through box我有什么：通过盒子的线性渐变
What I need: curve through box我需要什么：通过盒子的曲线
2 个解决方案
解决方案1
0 2021-07-18 19:41:48
try using radial-gradient instead of linear-gradient .尝试使用radial-gradient而不是linear-gradient 。 if you play a little bit with it you may achieve what you want如果你稍微玩玩它，你可能会达到你想要的
Learn more about radial-gradient :了解有关radial-gradient更多信息：
解决方案2
0 已采纳 2021-07-18 20:12:29
is it this you want to do这是你想做的吗
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
div {
background-image: radial-gradient(
ellipse farthest-side at 92% 378%,
#9fa4a9 21%,
#7b7b7b 100%,
#3e3f40 35%
);
width: 421px;
height: 150px;
}
</style>
</head>
<style></style>
<body>
<div></div>
</body>
</html>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.