この画像で同様の効果を達成しようとしています: http://i.imgur.com/zTkMou8.jpg div の内側の境界の丸みを帯びたエッジ。CSSでそれを行うことは可能ですか?div はレスポンシブでいっぱいであると想定されるため、div のサイズに応じて小さくまたは大きくできる境界線効果を持たせるのが最善です。
.image-container
{
border-bottom:#000 30px solid;
border-radius: 1em 4em 1em 4em;
border-bottom: 50px solid;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap-theme.min.css" rel="stylesheet"/>
<div class="container image-container">
<img class="img-responsive" src="http://i.imgur.com/uqXZmk4.jpg" />
</div>