css - 使用css3创建右曲线

Question

我想使用 css 创建如下图所示的曲线。

我正在尝试这样的事情:

.test {
background-color: #1d637d;
    color: #ffffff;
    border-right: 0 solid #cccccc;
    border-radius: 0px 60px 60px 10px/10px 200px 200px 0px;
}

Answer 1

我可以建议您使用两个 <div> 来解决这个问题s 和 overflow: hidden; :

https://jsfiddle.net/pf1no14x/

您可以根据需要操纵元素的大小和位置。

而且您仍然可以在.test 中放置一些内容通过使用 position: absolute; 创建另一个元素或 z-index大于 .inner的。