Question

我正在使用一些css形状，我做了一个循环div。我有一些特定的设计要求，规定圆形div的上半部分应该是可见的，并且应该与div的底部对齐。应隐藏下半部分（下方）。

问题我想删除圆形div的下半部分。它重叠在下一个div中。

我尝试了z-index，但仍然在这里继续我的代码。

＆＃13;

    .type1 {
        position: absolute;
        width: 600px;
        height: 600px;
        left: -100px;
        top: 280px;
        background: yellow;
        bottom: 0;
        border-radius: 50%;
    }
    .text{
          margin-left: 30%;
        margin-top: 30%;
    }

＆＃13;

     <div style='background-image:url("https://i.imgsafe.org/69e56d5ec8.jpg");height: 600px;position:relative;'>
      <div class="circleBase type1">
          
           <h1 class="text">
           some text inside
           </h1>
        </div>
        </div>  
       <div>
       <h1>
       some other text
       </h1>
       </div>

＆＃13;

JSFIDDLE

Answer 1

overflow:hidden需要在这里使用

Fiddle

Answer 2

像这里一样使用overflow:hidden：

Fiddle

从底部删除圆形div的一部分

2 个答案: