How to make a curve on a rectangle's top in css? only in top edge

后端 未结 3 2032
有刺的猬
有刺的猬 2020-12-21 06:59

I want to create the following shape: \"enter

Important: if I use \"Border Radius\" I

3条回答
  •  萌比男神i
    2020-12-21 07:20

    You can use border radius

    http://jsfiddle.net/wULyB/

    CSS

    #out{
        width: 100px;
        height: 100px;
        overflow: hidden;
        background: green;
        position: relative;
    }
    #in{
        width: 200px;
        height: 200px;
        border-radius: 100px;
        background: black;
        position: absolute;
        left: -50px;
        top: 30px;
    }
    

    You can play around with the numbers but you get the idea

提交回复
热议问题