【问题标题】:Curve arc between two sections [closed]两个部分之间的曲线弧[关闭]
【发布时间】:2021-07-05 06:44:29
【问题描述】:

如何使用 CSS 或 SVG 在两个部分之间制作弯曲的弧线,如下所示: (灰色部分和蓝色页脚之间的橙色弧线)

【问题讨论】:

  • 您可以通过多种方式进行操作。你是如何处理这个问题的?你能包括一些代码吗?我会使用带有绝对位置和伪元素的额外 div 元素,但这只是我。
  • @DebsmitaPaul 谢谢你,我试过了,但我不能完全按照例子来做

标签: css svg css-shapes


【解决方案1】:

多重背景和剪辑路径

.box {
  height:300px;
  background:
    radial-gradient(75%  95% at 56% 100%,blue 99%,transparent)
    orange;
  clip-path:ellipse(80% 100% at 50% 100%)
}
<div class="box"></div>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2020-10-29
    • 1970-01-01
    • 2013-12-17
    • 2015-01-12
    • 2022-10-13
    • 2016-06-14
    • 1970-01-01
    • 2016-02-16
    相关资源
    最近更新 更多