在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ 如何實(shí)現(xiàn)這種border的效果?

如何實(shí)現(xiàn)這種border的效果?

這個是我想要實(shí)現(xiàn)的效果
圖片描述

這個是我的代碼


.main .middle .m-middle .common{
  float: left;
  padding: 10px;
  text-align: center;
  position: relative;
  margin: 0 auto 30px;
  z-index: 1;
  border: 1px solid #e4ecf3;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

這個是做出來的效果
圖片描述

請問我該拿這個border怎么辦T_T

回答
編輯回答
薄荷糖

里邊再套一層

<style>
   .border{
        border-bottom-right-radius: 4px;
        border-bottom-left-radius: 4px;
        border: 1px solid  #eee;
        border-top:none;
    }
</style>
<div>
    <img src="" alt="">
    <div class="border"><!--給這個DIV加border不就行了嗎-->
        <p>幼兒班</p>
        <span>共3課</span>
    </div>
</div>
2017年4月1日 18:41